Setting up your own test automation environment - Learn web development
google should automatically be loaded in a tab, "webdriver" should ...
... driver.quit(); }); }); in terminal, make sure you are inside your project folder, then enter the following command: node google_test you should see an instance of firefox automatically open up! google should automatically be loaded in a tab, "webdriver" should be entered in the search box, and the search button will be clicked. webdriver will then wait for 2 seconds; the document title is then accessed, and if it is "webdriver - google search", we will return a message to claim the test is passed. webdriver will then close down the firefox instance and stop. testing in multiple browsers at once there is also nothing to stop you running the test on multiple browsers simultaneously. let's try this! create another new file inside your project directory called google_test_multi...
...test(driver_chr); function searchtest(driver) { driver.get('http://www.google.com'); driver.findelement(by.name('q')).sendkeys('webdriver'); driver.sleep(1000).then(function() { driver.findelement(by.name('q')).sendkeys(webdriver.key.tab); }); driver.findelement(by.name('btnk')).click(); driver.sleep(2000).then(function() { driver.gettitle().then(function(title) { if(title === 'webdriver - google search') { console.log('test passed'); } else { console.log('test failed'); } driver.quit(); }); }); } in terminal, make sure you are inside your project folder, then enter the following command: node google_test_multiple if you are using a mac and do decide to test safari, you might get an error message along the lines of "...
...And 9 more matches

Defining Cross-Browser Tooltips - Archive of obsolete content
e browser that cannot display images). in a visual browser, the image should be displayed and the alt text should not. this assumes that the browser can find the image and that it supports the image format used; if either of these is not true, and the image cannot be displayed, then the alt text should be displayed in place of the missing image. ...
...ay images). in a visual browser, the image should be displayed and the alt text should not. this assumes that the browser can find the image and that it supports the image format used; if either of these is not true, and the image cannot be displayed, then the alt text should be displayed in place of the missing image. ...
...he browser can find the image and that it supports the image format used; if either of these is not true, and the image cannot be displayed, then the alt text should be displayed in place of the missing image. on the other hand, the html 4.01 definition of the title attribute states: title = text cs this attribute offers advisory information about the element for which it is set. ...
...And 7 more matches

Implementation Status - Archive of obsolete content
ter index here we give an overview of xforms 1.1 specification chapters and the current status of the mozilla support. the sections are marked with their current status: supported, partial support, in progress, and not currently supported. we have listed the most relevant bugs here, but check out the bugzilla xforms buglist for the complete list. 3. ...
...lex schema validation 278761; 278762; 3.3.4 bind partial using the index() function in binds does not work. 292333; 3.4 extension module unsupported 300760; 3.5 mustunderstand module unsupported 300757; 4. processing model (events) section title status notes bugs 4 processing model (events) partial the xforms-recalculate, xforms-revalidate, and xforms-refresh events are not as separated as they should be. 278448; 338146; 4.2 initialization events supported 4.2.1 xforms-model-construct supported ...
... supported 4.8.3 recalculate() supported 4.8.4 revalidate() supported 4.8.5 refresh() supported 4.9 feature string for the hasfeature method call supported 5. datatypes section title status notes bugs 5.1 xml schema built-in datatypes partial whitespace facet not supported. 5.2.1 additional xforms datatypes to allow empty content unsupported 5.2.2 xforms:listitem supported 5.2.3 xforms:listitems supporte...
...And 7 more matches

Text labels and names - Accessibility
e label text: <div role="dialog" aria-label="personal details updated confirmation"> <p>your personal details were successfully updated. ...
...utton> </div> see also role="dialog" role="alertdialog" aria-label aria-labelledby wai-aria: dialog role dialog authoring practices documents must have a title it is important on each html document to include a <title> that describes the page's purpose. a common navigation technique for users of assistive technology is to infer what content a page contains by reading its title. if the title is not available, they have to navigate the page to determine its content, which can be a time consuming and potentially confusing process. ...
...e a title it is important on each html document to include a <title> that describes the page's purpose. a common navigation technique for users of assistive technology is to infer what content a page contains by reading its title. if the title is not available, they have to navigate the page to determine its content, which can be a time consuming and potentially confusing process. ...
...And 7 more matches

Places Developer Guide
e(ci.nsiioservice) .newuri("http://www.mozilla.com", null, null); var bookmarkid = bookmarks.insertbookmark( bookmarks.toolbarfolder, // the id of the folder the bookmark will be placed in. bookmarkuri, // the uri of the bookmark - an nsiuri object. bookmarks.default_index, // the position of the bookmark in its parent folder. "my bookmark title"); // the title of the bookmark. creating a folder var folderid = bookmarks.createfolder( bookmarks.toolbarfolder, // the id of the folder the new folder will be placed in. "my folder title", // the title of the new folder. bookmarks.default_index); // the position of the new folder in its parent folder. creating a separator var separatorid = bookmarks.insertseparator( bookmarks.toolbarfolder, ...
...euri = ioservice.newuri("http://www.mozilla.com", null, null); var feeduri = ioservice.newuri("http://www.mozilla.org/news.rdf", null, null); var livemarks = cc["@mozilla.org/browser/livemark-service;2"] .getservice(ci.nsilivemarkservice); livemarks.createlivemark(bookmarks.toolbarfolder, // the id of the folder the livemark will be placed in "my livemark title", // the title of the livemark siteuri, // the uri of the site. a nsiuri object. feeduri, // the uri of the actual feed. a nsiuri object. bookmarks.default_index); // the position of the livemark in its parent folder. accessing bookmarks and related items accessing item properties for all items: string getitemtitle(aitemid) - returns an item's title int64 getit...
...result = history.executequery(query, history.getnewqueryoptions()); // the root property of a query result is an object representing the folder you specified above. var foldernode = result.root; // open the folder, and iterate over its contents. foldernode.containeropen = true; for (var i=0; i < foldernode.childcount; ++i) { var childnode = foldernode.getchild(i); // some item properties. var title = childnode.title; var id = childnode.itemid; var type = childnode.type; // some type-specific actions. if (type == ci.nsinavhistoryresultnode.result_type_uri) { var uri = childnode.uri; } else if (type == ci.nsinavhistoryresultnode.result_type_folder) { childnode.queryinterface(ci.nsinavhistorycontainerresultnode); childnode.containeropen = true; // now you can iterate over a subfo...
...And 6 more matches

Adding captions and subtitles to HTML5 video - Developer guides
difficulty understanding the language of the film, rather than deaf or hard-of-hearing people. the <track> element html5 allows us to specify subtitles for a video using the <track> element. the various attributes of this element allow us to specify such things as the type of content that we're adding, the language it's in, and of course a reference to the text file that contains the actual subtitle information. webvtt the files that contain the actual subtitle data are simple text files that follow a specified format, in this case the web video text tracks (webvtt) format. the webvtt specification is still being worked on, but major parts of it are stable so we can use it today. video providers (such as the blender foundation) provide captions and subtitles in a text format with their vid...
...xt (srt) format. these can be easily converted to webvtt using an online converter such as srt2vtt. modifications to the html and css this section summarises the modifications made to the previous article's code in order to facilitate the addition of subtitles to the video. if you are not interested in this, and just want to get straight into the javascript and more relevant css, skip to the subtitle implementation section. in this example we are using a different video, sintel, as it actually has some speech in it and therefore is better for illustrating how subtitles work! html markup as mentioned above, we need to make use of the new html5 <track> element to add our subtitle files to the html5 video. we actually have our subtitles in three different languages — english, german, and s...
... the default attribute is set on the english <track> element, indi...
...And 6 more matches

Index - Archive of obsolete content
service interface implemented by the nsimicrosummaryservice component, then call its installgenerator() method, passing it an xml document containing the generator. 555 microsummary xml grammar reference microsummaries a microsummary generator is an xml document that describes how to pull specific information from a web page to be presented in summary form as a bookmark whose title changes based on the content of the page it targets. 556 migrate apps from internet explorer to mozilla when netscape started the mozilla browser, it made the conscious decision to support w3c standards. as a result, mozilla is not fully backwards-compatible with netscape navigator 4.x and microsoft internet explorer legacy code; for example, mozilla does not support <layer> ...
... xul attributes, xul reference no summary! 1112 textnode.value xul attributes, xul reference no summary! 1113 timeout xul attributes, xul reference no summary! 1114 timepicker.increment xul attributes, xul reference no summary! 1115 timepicker.value xul attributes, xul reference no summary! 1116 title xul attributes, xul reference no summary! 1117 titlebar no summary! 1118 toolbar.mode xul attributes, xul reference no summary! 1119 toolbarbutton.title no summary! 1120 toolbarbutton.type xul attributes, xul reference no summary! 1121 toolbarname xul attributes, xul reference no su...
...perties, xul reference no summary! 1382 completedefaultindex xul properties, xul reference no summary! 1383 container xul properties, xul reference no summary! 1384 contentdocument xul properties, xul reference no summary! 1385 contentprincipal xul properties, xul reference no summary! 1386 contenttitle xul properties, xul reference no summary! 1387 contentview xul properties, xul reference no summary! 1388 contentvieweredit xul properties, xul reference no summary! 1389 contentviewerfile xul properties, xul reference no summary! 1390 contentwindow xul reference no summary! 1391 contextmenu ...
...And 5 more matches

Ajax navigation example - Web APIs
ajax website composed only of three pages (first_page.php, second_page.php and third_page.php). to see how it works, please create the following files (or git clone https://github.com/giabao/mdn-ajax-nav-example.git ): note: for fully integrating the <form> elements within this mechanism, please take a look at the paragraph submitting forms and uploading files. first_page.php: <?php $page_title = "first page"; $as_json = false; if (isset($_get["view_as"]) && $_get["view_as"] == "json") { $as_json = true; ob_start(); } else { ?> <!doctype html> <html> <head> <?php include "include/header.php"; echo "<title>" . $page_title . "</title>"; ?> </head> <body> <?php include "include/before_content.php"; ?> <p>this paragraph is shown only when the ...
..."</title>"; ?> </head> <body> <?php include "include/before_content.php"; ?> <p>this paragraph is shown only when the...
... include "include/after_content.php"; echo "</body>\n</html>"; } ?> second_page.php: <?php $page_title = "second page"; $as_json = false; if (isset($_get["view_as"]) && $_get["view_as"] == "json") { $as_json = true; ob_start(); } else { ?> <!doctype html> <html> <head> <?php include "include/header.php"; echo "<title>" . $page_title . "</title>"; ?> </head> <body> <?php include "include/before_content.php"; ?> <p>this paragraph is shown only when the navigation starts from <strong>second_page.php</strong>.</p> <div id="ajax-content"> <?php } ?> <p>this is the content of <strong>second_page.php</strong>.</p> <?php if ($as_json) { echo json_encode(array("page" => $page_title, "content" => ob_get_clean()))...
...And 5 more matches

Additional Navigation - Archive of obsolete content
t, the value of the ?photo variable 'http://www.xulplanet.com/ndeakin/images/t/palace.jpg' will be used as the subject, the predicate will be 'http://purl.org/dc/elements/1.1/title', and the object will be 'canal'. since there are no variables to fill into the triple, the builder will just confirm that such a triple exists in the datasource. the triple doesn't exist for the first result since the title for the first photo is 'palace from above', so the potential result will be removed from the data. for the second result, such an arc does exist, so the result is kept. like the first result, there is no arc for the third photo, so it is also removed. the resulting data will look like the following: (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images...
...m the data. for the second result, such an arc does exist, so the result is kept. like the first result, there is no arc for the third photo, so it is also removed. the resulting data will look like the following: (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/canal.jpg) here is the example. naturally, we will need to add a binding for the ?title variable if we wish to display it, or we could just hardcode it since we know the value will be 'canal'. usually you won't be filtering on a title though--you would instead filter on a value that acts like a type. there has to be at least one variable used in a triple in either the subject or the object attributes, or both. you can't have a triple with no variables. that's not an issue though, si...
...the builder won't generate any output in this situation. the member tag must have variables for both the container and child attributes. it wouldn't be very common to filter for a specific child anyway. source navigation triples may also be used to navigate up the graph as well as downwards, following the graph arrows in t...
...And 4 more matches

TPS Bookmark Lists
s, described below. bookmark objects valid properties are: uri: the bookmark uri. required. title: the bookmark title. optional. defaults to the bookmark uri. loadinsidebar: true or false. optional. toggles the "load in sidebar" property. description: the bookmark description. optional. tags: an array of tags for the bookmark. optional. keyword: the keyword for the bookmark. optional. after: the title of the bookmark item expected to be found after this bookmark; used only in verify and modify actions. before: the title of the bookmark item expected to be found before this bookmark; used only in verify and modify actions. changes: an object containing new properties to be set for this bookmark when this asset list is used in a modify action. the properties for this object include the uri, title...
... used only in verify and modify actions. changes: an object containing new properties to be set for this bookmark when this asset list is used in a modify action. ...
... position of the named bookmark, causing that bookmark to be positioned below the current one) example: { uri: "http://www.google.com", title: "google", loadinsidebar: false, tags: [ "google", "computers", "misc" ] } livemark objects valid properties are: livemark: the livemark name. required. siteuri: the livemark's uri. optional. feeduri: the livemark's feed uri. required. after: the title of the bookmark item expected to be found after this livemark; used only in verify and modify actions. before: the title of the bookmark item expected to be found before this livemark; used only in verify and modify actions. changes: an object containing new properties to be set for this livemark when this asset list is used in a modify action. the properties for this object include the livemark, ...
...And 4 more matches

nsINavHistoryObserver
parameters auri the uri of the page that expired. avisittime the visit time that expired; this may (or may not) be 0 if a bookmark with no visits is deleted. awholeentry true if this expiration will result in the entire history entry being deleted from the history store; if false, only the specified visit is being deleted. ...
... the uri of the page that expired. avisittime the visit time that expired; this may (or may not) be 0 if a bookmark with no visits is deleted. awholeentry true if this expiration will result in the entire history entry being deleted from the history store; if false, only the specified visit is being deleted. ontitlechanged() called whenever either the real title or the custom title of the page changes. both titles are always included in this notification, even though only one is changed each time it is called, since often consumers will want to display the user title if available, falling back to the title specified by the page's <title> element if there is no user title. it's important to note that there is a difference between an empty title and a null title. an empty stri...
...hanges. both titles are always included in this notification, even though only one is changed each time it is called, since often consumers will want to display the user title if available, falling back to the title specified by the page's <title> element if there is no user title. it's important to note that there is a difference between an empty title and a null title. an empty string means the title was specifically set to be nothing. null means the title was not set at all. from c++ code, use the isvoid() and setisvoid() methods to see whether an empty string is "null" or not; in either case it will always be an empty string. ...
...And 4 more matches

confirm - Archive of obsolete content
nly support the first, one-parameter method and will throw an error on occuring the extended form. see the notes at the end of this document for a safe way to implement a fallback. atext the string to be displayed in the confirmation dialog. this string is typically in the form of a prompt for the user (e.g., "are you sure you want to delete the selected file(s)?"). ...
...t for the user (e.g., "are you sure you want to delete the selected file(s)?"). adialogtitle the string to be used as the dialog title. defaults to "confirm" (or the localized equivalent). abuttonflags a set of flags defining the buttons that should appear in the dialog. the value is calculated by multiplying the corresponding button position constant with a button title constant for each button, then adding the results and any additional options (see other constants). ...
...e value is calculated by multiplying the corresponding button position constant with a button title constant for each button, then adding the results and any additional options (see other constants). ...
...And 3 more matches

Correctly Using Titles With External Stylesheets - Archive of obsolete content
external stylesheets are often associated with html documents using the <link rel="stylesheeet"> element, but it is important to use the element's title attribute properly. this is because the title attribute on a <link rel="stylesheeet"> element makes it either preferred or an alternative style sheet. this can lead to a stylesheet being ignored, which is typically not what an author intends to do. why titles matter the title attribute affects how your external stylesheet is applied to a document. ...
... there are three kinds of stylesheets that are possible: persistent, preferred, and alternate stylesheets. ...
...ferred or an alternative style sheet. this can lead to a stylesheet being ignored, which is typically not what an author intends to do. why titles matter the title attribute affects how your external stylesheet is applied to a document. in fact, the use of the title attribute is so significant that html 4.01 categorizes stylesheets according to the presence or absence of a title. by including a title attribute, you can control whether a particular stylesheet always affects a document, or if it is only used under certain circumstances. there are three kinds of stylesheets that are possible: persistent, preferred, and alternate stylesheets. authors will be most familiar with persistent stylesheets, of which any number may be applied to a document at once. a persistent stylesheet is one which h...
...And 3 more matches

Getting started with HTML - Learn web development
ing and closing quote marks. active learning: adding attributes to an element another example of an element is <a>. this stands for anchor. an anchor can make the text it encloses into a hyperlink. anchors can take a number of attributes, but several are as follows: href: this attribute's value specifies the web address for the link. for example: href="https://www.mozilla.org/". title: the title attribute specifies extra information about the link, such as a description of the page that is being linked to. for example, title="the mozilla homepage". this appears as a tooltip when a cursor hovers over the element. target: the target attribute specifies the browsing context used to display the link. for example, target="_blank" will display the link in a new tab. if you want to display the ...
...r the element. target: the target attribute specifies the browsing context used to display the link. for example, target="_blank" will display the link in a new tab. if you want to display the linked content in the current tab, just omit this attribute. edit the line below in the input area to turn it into a link to your favorite website. add the <a> element. add the href attribute and the title attribute. specify the target attribute to open the link in the new tab. you'll be able to see your changes update live in the output area. you should see a link—that when hovered over—displays the value of the title attribute, and when clicked, navigates to the web address in the href attribute. remember that you need to include a space between the element name, and between each attribute.
...ss a number of strange markup styles, including attribute values without quotes. this is permitted in certain circumstances, but it can also break your markup in other circumstances. for example, if we revisit our link example from earlier, we could write a basic version with only the href attribute, like this: <a href=https://www.mozilla.org/>favorite website</a> however, as soon as we add the title attribute in this way, there are problems: <a href=https://www.mozilla.org/ title=the mozilla homepage>favorite website</a> as written above, the browser misinterprets the markup, mistaking the title attribute for three attributes: a title attribute with the value the, and two boolean attributes, mozilla and homepage. obviously, this is not intended! it will cause errors or unexpected behavior,...
...And 3 more matches

nsINavBookmarksService
is does not restrict api calls, only ui actions. boolean getfolderreadonly( in long long aitemid ); parameters aitemid the item id of the folder. return value returns true if the folder is marked as read-only, otherwise returns false. getfoldertitle() obsolete since gecko 1.9 (firefox 3) note: getitemtitle() provides an alternative for this method. get the title for a bookmark folder. astring getfoldertitle( in print64 folder ); parameters folder the folder whose title should be retrieved. return value the title of the folder. exceptions thrown invalid argument exception if it can not find a folder with the given id. getfolderuri() obsolete since gecko 1.9 (firefox 3) note: getbookmarkuri() provides an alterna...
...ied() this method retrieves the last modified time for an item. note: when an item is added lastmodified is set to the same value as dateadded. prtime getitemlastmodified( in long long aitemid ); parameters aitemid the id of the item whose last modified time is to be retrieved. return value returns the last modified time for the given item. ...
...he last modified time for an item. note: when an item is added lastmodified is set to the same value as dateadded. prtime getitemlastmodified( in long long aitemid ); parameters aitemid the id of the item whose last modified time is to be retrieved. return value returns the last modified time for the given item. getitemtitle() this method retrieves the title for an item. if no item title is available it will return a void string (null in js environment). autf8string getitemtitle( in nsiuri uri, obsolete since gecko 1.9 in long long aitemid ); parameters uri obsolete since gecko 1.9 the uri of the item whose title should be retrieved. aitemid the id of the item whose title should be retrieved. return value returns the title of the item. getitemtype() this method ...
...And 3 more matches

Index - Web APIs
e api, animation, animationtimeline, document, documenttimeline, experimental, property, reference, web animations, timeline, waapi, web animations api the timeline readonly property of the document interface represents the default timeline of the current document. this timeline is a special instance of documenttimeline that is automatically created on page load. 966 document.title api, command api, document, html dom, needsspectable, property, reference the document.title property gets or sets the current title of the document. 967 document.tooltipnode api, api:mozilla extensions, dom, draft, gecko, mozilla, non-standard, property, reference the document.tooltipnode property returns the node which is the target of the current <xul:tooltip>. ...
..., htmlelement, needsspectable, property, reference, style the htmlelement.style property is used to get as well as set the inline style of an element. when getting, it returns a cssstyledeclaration object that contains a list of all styles properties for that element with values assigned for the attributes that are defined in the element's inline style attribute. 1637 htmlelement.title api, html dom, htmlelement, property, reference the htmlelement.title property represents the title of the element: the text usually displayed in a 'tooltip' popup when the mouse is over the node. 1638 htmlelement: animationcancel event animation, animationevent, css animations, event, reference, animationcancel, events an animationcancel event is fired when a css an...
...nts. 1943 htmltimeelement.datetime api, html dom, htmltimeelement, property, reference the htmltimeelement.datetime property is a domstring that reflects the datetime html attribute, containing a machine-readable form of the element's date and time value. 1944 htmltitleelement api, html dom, interface, reference the htmltitleelement interface contains the title for a document. this element inherits all of the properties and methods of the htmlelement interface. 1945 htmltrackelement api, html dom, htmltrackelement, interface, needsnewlayout, reference the htmltrackelement interface represents an html <track> element within the dom. this element can be used as a child of either <audio> or <video> to specify a text track containing inf...
...And 3 more matches

HTML attribute: pattern - HTML: Hypertext Markup Language
mented in our guide on regular expressions; the 'u' flag is specified when compiling the regular expression, so that the pattern is treated as a sequence of unicode code points, instead of as ascii. no forward slashes should be specified around the pattern text. if the specified pattern is not specified or is invalid, no regular expression is applied and this attribute is ignored. tip: use the title attribute to specify text that most browsers will display as a tooltip to explain what the requirements are to match the pattern. you should also include other explanatory text nearby. some of the input types supporting the pattern attribute, notably the email and url input types, have expected value syntaxes that must be matched. if the pattern attribute isn't present, and the value doesn't ma...
...y the email and url input types, have expected value syntaxes that must be matched. if the pattern attribute isn't present, and the value doesn't match the expected syntax for that value type, the validitystate object's read-only typemismatch property will be true. usability when including a pattern, provide a description of the pattern in visible text near the control. ...
.... if the pattern attribute isn't present, and the value doesn't match the expected syntax for that value type, the validitystate object's read-only typemismatch property will be true. usability when including a pattern, provide a description of the pattern in visible text near the control. additionally, include a title attribute which gives a description of the pattern. user agents may use the title contents during constraint validation to tell the user that the pattern is not matched. some browsers show a tooltip with title contents, improving usability for sighted users. additionally, assistive technology may read the title aloud when the control gains focus, but this should not be relied upon for accessibility. constraint validation if the input’s value is not the empty string and the ...
...And 3 more matches

<abbr>: The Abbreviation element - HTML: Hypertext Markup Language
the source for this interactive example is stored in a github repository. if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. content categories flow content, phrasing content, palpable content permitted content phrasing content tag omission none, both the starting and ending tag are mandatory. ...
... permitted content phrasing content tag omission none, both the starting and ending tag are mandatory. permitted parents any element that accepts phrasing content implicit aria role no corresponding role permitted aria roles any dom interface htmlelement attributes this element only supports the global attributes. ...
... usage notes typical use cases it's certainly not required that all abbreviations be marked up using <abbr>. ...
...And 3 more matches

places/bookmarks - Archive of obsolete content
instance to the bookmarks database // and store the emitter let emitter = save(bookmark); // listen for events emitter.on("data", function (saved, inputitem) { // on a "data" event, an item has been updated, passing in the // latest snapshot from the server as `saved` (with properties // such as `updated` and `id`), as well as the initial input // item as `inputitem` console.log(saved.title === inputitem.title); // true console.log(saved !== inputitem); // true console.log(inputitem === bookmark); // true }).on("end", function (saveditems, inputitems) { // similar to "data" events, except "end" is an aggregate of // all progress events, with ordered arrays as `saveditems` // and `inputitems` }); creating several bookmarks with a new group let { bookmark, group, save } = r...
...ell as a query options object. query properties are and'd together within a single query object, but are or'd together across multiple query objects. let { search, unsorted } = require("sdk/places/bookmarks"); // simple query with one object search( { query: "firefox" }, { sort: "title" } ).on("end", function (results) { // results matching any bookmark that has "firefox" // in its url, title or tag, sorted by title }); // multiple queries are or'd together search( [{ query: "firefox" }, { group: unsorted, tags: ["mozilla"] }], { sort: "title" } ).on("end", function (results) { // our first query is the same as the simple query above; // all of those results are also returned here. since multiple // queries are or'd together, we also get bookmarks that // match the second ...
...match the second query. the second query's properties // are and'd together, so results that are in the platform's unsorted // bookmarks folder, and are also tagged with 'mozilla', get returned // as well in this query }); globals constructors bookmark(options) creates an unsaved bookmark instance. parameters options : object required options: name type title string the title for the bookmark. required. url string the url for the bookmark. required. optional options: name type group group the parent group that the bookmark lives under. defaults to the bookmarks.unsorted group. index number the index of the bookmark within its group. last item...
...And 2 more matches

Localization - Archive of obsolete content
see limitations below. localized strings translated strings are kept in a directory called "locale" under your main add-on directory, one file for each locale. ...
...see limitations below. localized strings translated strings are kept in a directory called "locale" under your main add-on directory, one file for each locale. ...
... a statement like: # does not work. html tags are inserted as text. ...
...And 2 more matches

Multiple Rules - Archive of obsolete content
<where subject="?title" rel="equals" value="canal"/> <action> <button uri="?photo" image="?photo" label="view" orient="vertical"/> </action> </rule> <rule> <action> <image uri="?photo" src="?photo"/> </action> </rule> </template> </hbox> this template contains a query with two rules. the query generates a list of the photos and assigns the title of each photo to the variable '?title'. note that the full query syntax must be used to use conditions within rules. the first rule contains a new element, where which is used to define a condition. the second rule does not contain a where element, so it matches results unconditionally, or any result that wasn't matched by a previous rule. in this example, the where element in the first rule defin...
... the full query syntax must be used to use conditions within rules. the first rule contains a new element, where which is used to define a condition. the second rule does not contain a where element, so it matches results unconditionally, or any result that wasn't matched by a previous rule. in this example, the where element in the first rule defines a condition which matches results that have a title of 'canal'. three attributes are used for this purpose. the subject is the variable from the result that want to compare. in this case, '?title' is used to compare the title. the rel specifies a relation operator to compare with. here 'equals' is the operator used so an exact match is needed. the value attribute is the value to compare to, which here is 'canal'. as the datasource has three photos,...
...tributes are used for this purpose. the subject is the variable from the result that want to compare. in this case, '?title' is used to compare the title. the rel specifies a relation operator to compare with. here 'equals' is the operator used so an exact match is needed. the value attribute is the value to compare to, which here is 'canal'. as the datasource has three photos, one of which has a title of 'canal', this photo will match the first rule and the content's of that rule's action body will be generated. the remaining two photos do not match the first rule, however they do match the second rule, as the second rule has no where clauses. for these two photos, the action body of the second rule will apply. when used together in this example, the results are combined and only three results ...
...And 2 more matches

Displaying Places information using views
n tree view. column binding the built-in tree view makes it easy to hook up specific columns of your tree to specific properties of the result. it does so by recognizing certain magic values of the id attribute on your treecol elements. a property in the result is bound to a column via that column's id attribute. ...
...t column's id attribute. for example, by setting a column's id to "title", you tell the view to display the title of the nsinavhistoryresultnode of each row in that column. ...
...s id attribute. for example, by setting a column's id to "title", you tell the view to display the title of the nsinavhistoryresultnode of each row in that column. ...
...And 2 more matches

nsINavHistoryResultViewer
nsinavhistorycontainerresultnode acontainernode ); parameters acontainernode the container that should be rebuilt. nodeannotationchanged() called right after the annotation on a node has changed. this is called when the annotation is changed, set, or unset. void nodeannotationchanged( in nsinavhistoryresultnode anode, in autf8string aannoname ); parameters anode the node whose title has changed. aannoname the name of the annotation that hanged. nodedateaddedchanged() called right after the date added property of a node has changed. void nodekeywordchanged( in nsinavhistoryresultnode anode, in prtime anewvalue ); parameters anode the node whose title has changed. anewvalue the new value for the node's date added property. nodelastmodifiedchanged() called r...
... anewvalue the new value for the node's last modified property. nodehistorydetailschanged() called right after a node's last access time or access count has changed. ...
...onchanged() called right after the icon of a node has changed. void nodeiconchanged( in nsinavhistoryresultnode anode ); parameters anode the node whose icon has changed. nodekeywordchanged() called right after the keyword property of a node has changed. void nodekeywordchanged( in nsinavhistoryresultnode anode, in autf8string anewkeyword ); parameters anode the node whose title has changed. anewtitle the new value for the node's keyword property. nodemoved() called when a node is moved from aoldparent at aoldindex to anewparent at anewindex. the item may be a container or a leaf. void itemmoved( in nsinavhistoryresultnode anode, in nsinavhistorycontainerresultnode aoldparent, in unsigned long aoldindex, in nsinavhistorycontainerresultnode anewparent, in u...
...And 2 more matches

Window: popstate event - Web APIs
. the current page's session history stack entry will be referred to as current-entry. if new-entry doesn't currently contain an existing document, fetch the content and create its document before continuing. this will eventually send events such as domcontentloaded and load to the window containing the document, but the steps below will continue to execute in the meantime. if current-entry's title wasn't set using one of the history api methods (pushstate() or replacestate(), set the entry's title to the string returned by its document.title attribute. if the browser has state information it wishes to store with the current-entry before navigating away from it, it then does so. the entry is now said to have "persisted user state." this information the browser might add to the history sessi...
...you can see, the popstate event is nearly the last thing done in the process of navigating pages in this way. ...
...hing done in the process of navigating pages in this way. ...
...And 2 more matches

Box-shadow generator - CSS: Cascading Style Sheets
; border: 1px solid #ccc; border-radius: 3px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } #stack_container .container { height: 100%; width: 100%; position: absolute; left: 100%; transition-property: left; transition-duration: 0.5s; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } #stack_container .title { text-align: center; font-weight: bold; line-height: 2em; border-bottom: 1px solid #43a6e1; color: #666; } /* * stack of layers for shadow */ #layer_manager { width: 17%; background-color: #fefefe; margin: 0 1% 0 0; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; } #layer_manager .button { width: 30%; height: 25px; margin:0 ...
... * { float: left; } .wrap-right > * { float: right; } @media (min-width: 960px) { .wrap-left { width: 45%; } .wrap-right { width: 55%; } } @media (max-width: 959px) { .wrap-left { width: 30%; } .wrap-right { width: 70%; } } #controls { color: #444; margin: 10px 0 0 0; } #controls .category { width: 500px; margin: 0 auto 20px; padding: 0; } #controls .category .title { width: 100%; height: 1.5em; line-height: 1.5em; color: #aaa; text-align: right; } #controls .category > .group { border: 1px solid #ccc; border-radius: 3px; } /** * color picker */ @media (min-width: 960px) { #controls .colorpicker { width: 420px; } } @media (max-width: 959px) { #controls .colorpicker { width: 210px; } } #colorpicker { width: 100%; margin: 0 auto; } #c...
...'' : title; var input = document.createelement('input'); var info = document.createelement('span'); info.textcontent = title; input.setattribute('type', 'text'); input.setattribute('data-action', 'set-' + action + '-' + topic); node.appendchild(info); node.appendc...
...And 2 more matches

Color picker tool - CSS: Cascading Style Sheets
border-box; box-sizing: border-box; transition: all 0.2s; } #delete[drag-state='enter'] { background-color: #999; } /** * color theme */ #color-theme { margin: 0 8px 0 0; border: 1px solid #eee; display: inline-block; float: right; } #color-theme .box { width: 80px; height: 92px; float: left; } /** * color info box */ #color-info { width: 360px; float: left; } #color-info .title { width: 100%; padding: 15px; font-size: 18px; text-align: center; background-image: url('https://mdn.mozillademos.org/files/6071/color-wheel.png'); background-repeat:no-repeat; background-position: center left 30%; } #color-info .copy-container { position: absolute; top: -100%; } #color-info .property { min-width: 280px; height: 30px; margin: 10px 0; text-align: center; line-heigh...
... -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } #color-palette { width: 640px; font-family: arial, helvetica, sans-serif; color: #777; float: left; } #color-palette .container { width: 100%; height: 50px; line-height: 50px; overflow: hidden; float: left; transition: all 0.5s; } #color-palette .container > * { float: left; } #color-palette .title { width: 100px; padding: 0 10px; text-align: right; line-height: inherit; } #color-palette .palette { width: 456px; height: 38px; margin: 3px; padding: 3px; display: table; background-color: #fff; } #color-palette .palette .sample { width: 30px; height: 30px; margin: 3px; position: relative; border: 1px solid #ddd; float: left; transition: all 0.2s; } #color-palette .palette .s...
...function pickcolor() { uicolorpicker.setcolor('picker', this.color); }; colorsample.prototype.dragstart = function dragstart(e) { e.datatransfer.setdata('sampleid', this.uid); e.datatransfer.setdata('location', 'palette-samples'); }; var palette = function palette(text, size) { this.samples = []; this.locked = false; var palette = document.createelement('div'); var title = document.createelement('div'); var controls = document.createelement('div'); var container = document.createelement('div'); var lock = document.createelement('div'); container.classname = 'container'; title.classname = 'title'; palette.classname = 'palette'; controls.classname = 'controls'; lock.classname = 'lock'; title.textcontent = text; controls.appendchild(lo...
...And 2 more matches

<img>: The Image Embed element - HTML: Hypertext Markup Language
ead. this can be a confusing experience if the file name isn't representative of the image's contents. ...
...nfusing experience if the file name isn't representative of the image's contents. ...
...sibility tutorials alt-texts: the ultimate guide — axess lab how to design great alt text: an introduction | deque mdn understanding wcag, guideline 1.1 explanations understanding success criterion 1.1.1 | w3c understanding wcag 2.0 the title attribute the title attribute is not an acceptable substitute for the alt attribute. additionally, avoid duplicating the alt attribute's value in a title attribute declared on the same image. doing so may cause some screen readers to announce the description twice, creating a confusing experience. ...
...And 2 more matches

Index - Archive of obsolete content
lue xul attributes, xul reference no summary! 381 textnode.value xul attributes, xul reference no summary! 382 timeout xul attributes, xul reference no summary! 383 timepicker.increment xul attributes, xul reference no summary! 384 timepicker.value xul attributes, xul reference no summary! 385 title xul attributes, xul reference no summary! 386 titlebar no summary! 387 toolbar.mode xul attributes, xul reference no summary! 388 toolbarbutton.title no summary! 389 toolbarbutton.type xul attributes, xul reference no summary! 390 toolbarname xul attributes, xul reference no summary...
...l properties, xul reference no summary! 651 completedefaultindex xul properties, xul reference no summary! 652 container xul properties, xul reference no summary! 653 contentdocument xul properties, xul reference no summary! 654 contentprincipal xul properties, xul reference no summary! 655 contenttitle xul properties, xul reference no summary! 656 contentview xul properties, xul reference no summary! 657 contentvieweredit xul properties, xul reference no summary! 658 contentviewerfile xul properties, xul reference no summary! 659 contentwindow xul reference no summary! 660 contextmenu xul...
...x.label xul, xul properties, xul reference no summary! 861 textbox.type xul properties, xul reference no summary! 862 textbox.value xul properties, xul reference no summary! 863 timeout xul properties, xul reference no summary! 864 timepicker.value xul properties, xul reference no summary! 865 title xul properties, xul reference no summary! 866 toolbarname needshelp, xul properties, xul reference no summary! 867 toolbarset xul properties, xul reference no summary! 868 toolboxid toolbars, xul, xul reference no summary! 869 tooltip xul properties, xul reference no summary! 870 tooltiptext ...
...be used in place of the window element for dialog boxes. the buttons attribute may be used to set which buttons should appear in the dialog box. these buttons will be placed in the correct locations for the user's platform. 1116 dialogheader xul elements, xul reference a heading row for a dialog box. this element should be placed inside a dialog element. the header may have a title and a description. 1117 dropmarker xul elements, xul reference a dropmarker is a button with an arrow which will reveal more details when pressed. a dropmarker is not intended to be used as a separate element, but as part of another element. for instance the menulist and the popup type of datepicker use a dropmarker, that when pressed, will reveal a popup menu. 1118 ...

Bindings - Archive of obsolete content
n="view from the top of the tower looking east of the doges palace"/> if you try a full example based on this data, you will notice that only one result has been generated. this is because only one item has a description. here is the data after the first <triple> has been evaluated. ...
...one result has been generated. this is because only one item has a description. here is the data after the first <triple> has been evaluated. (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg, ?title = 'palace from above') (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/canal.jpg, ?title = 'canal') (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/obelisk.jpg, ?title = 'obelisk') the second triple will add a ?description for the first photo, adding a fourth variable-value pair to the existing data. for the second photo, the datasource doesn't have any matches for the description, so that potential result will be removed. the sam...
...iption for the first photo, adding a fourth variable-value pair to the existing data. for the second photo, the datasource doesn't have any matches for the description, so that potential result will be removed. the same happens for the third photo. in the end, only one photo remains. (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg, ?title = 'palace from above', ?description = 'view from the top of the tower looking east of the doges palace') thus, only one match exists, so only one set of content is generated. sometimes, it would be useful to have triples that match conditionally; that is, a triple that doesn't cause a result to be removed as a possible match. this is done with a binding element. this tag doesn't go in the query ...
...hes, only one of which will display a description. the photos that don't have a description will be treated as if the description were blank. that is, the ?description variable will be replaced with an empty string when analyzing the attributes in the action body. here is this example. you can have more than one binding if you wish. the others will be evaluated in a similar way. for instance, the title triple could be moved to a binding such that it could be optional also. « previousnext » ...

Multiple Rule Example - Archive of obsolete content
</vbox> </action> </rule> </template> </vbox> in this example, the first rule matches only those photos with title, description, and date properties. the second rule matches those photos with a title. if a photo did not have a title, it would not match any rule. in the example data, only the first photo has been given all the properties to match the first rule. ...
...as been given all the properties to match the first rule. the second photo has a title and date but no description, while the third photo has only a title. the first photo will match both rules whereas the other two photos will match only the second rule. ...
...ulting data will be: (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg, ?title = palace from above ?description = view from the top of the tower looking east of the doges palace, ?date = 2005-04-30t14:55:00+01.00) (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg, ?phototitle = palace from above) (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/canal.jpg, ?phototitle = canal) (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/obelisk.jpg, ?phototitle = obelisk) the first result matches the first rule and contains variables for the two additional predicates that were...
.... since the second rule doesn't refer to these variables, they will not be filled in. although the canal photo has a date, the second rule doesn't use it, so you cannot refer to the ?date variable in this rule. but, you could use a <binding> to get the date without requiring it to match the conditions. of course, the variable doesn't have to be ?date in the second rule. you might notice that the ?title variable is used in the first rule whereas the ?phototitle variable is used for the second rule, despite that they both store the value of the title predicate. there is no reason for this -- it is only used in this example to show that there is no connection between the variables used in the two rules. you can use different variables if it makes sense in the context of the template or the data, al...

Simple Example - Archive of obsolete content
ch potential result found so far. the builder will first fill in as many variables as it can. ...
...ike so: <triple subject="http://www.xulplanet.com/ndeakin/images/t/palace.jpg" predicate="http://purl.org/dc/elements/1.1/title" object="?title"/> the builder next calculates the value for ?title using the predicate 'http://purl.org/dc/elements/1.1/title'. in the rdf, the 'palace' resource has a value 'palace from above', so it will be added to the data network, assigned to the ?title variable. note that this value is a literal rather than a resource. (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg, ?title = 'palace from above') the process continues in a similar manner for the other two results. in the end, the network will contain the following data: (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = ...
...a resource. (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg, ?title = 'palace from above') the process continues in a similar manner for the other two results. in the end, the network will contain the following data: (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/palace.jpg, ?title = 'palace from above') (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/canal.jpg, ?title = 'canal') (?start = http://www.xulplanet.com/rdf/myphotos, ?photo = http://www.xulplanet.com/ndeakin/images/t/obelisk.jpg, ?title = 'obelisk') since the triple is the last statement, three matches total have been found. the action body might look like t...
...you might note that the image's src attribute uses the member variable ?photo <action> <vbox uri="?photo" align="start"> <image src="?photo"/> <label value="?title"/> </vbox> </action> it shouldn't be too difficult to tell what would appear in the window in this example. ...

Images in HTML - Learn web development
wasting bandwidth downloading an image that is not fitting the user's needs. the image may also end up looking distorted, if you don't maintain the correct aspect ratio. you should use an image editor to put your image at the correct size before putting it on your webpage. note: if you do need to alter an image's size, you should use css instead. image titles as with links, you can also add title attributes to images, to provide further supporting information if needed. in our example, we could do this: <img src="images/dinosaur.jpg" alt="the head and torso of a dinosaur skeleton; it has a large head with long sharp teeth" width="400" height="341" title="a t-rex on display in the manchester university museum"> this gives us a tooltip on mouse hover, just lik...
...ormation if needed. in our example, we could do this: <img src="images/dinosaur.jpg" alt="the head and torso of a dinosaur skeleton; it has a large head with long sharp teeth" width="400" height="341" title="a t-rex on display in the manchester university museum"> this gives us a tooltip on mouse hover, just like link titles: however, this is not recommended — title has a number of accessibility problems, mainly based around the fact that screen reader support is very unpredictable and most browsers won't show it unless you are hovering with a mouse (so e.g. no access to keyboard users). if you are interested in more information about this, read the trials and tribulations of the title attribute by scott o'hara. it is better to include such supporting inform...
...f6.jpg earlier we said to never hotlink to images on other servers, but this is just for learning purposes, so we'll let you off this one time. we would also like you to: add some alt text, and check that it works by misspelling the image url. set the image's correct width and height (hint: it is 200px wide and 171px high), then experiment with other values to see what the effect is. set a title on the image. if you make a mistake, you can always reset it using the reset button. if you get really stuck, press the show solution button to see an answer: playable code <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc to move focus away from the code area (tab inserts a tab character).</p> <textarea id="co...
...ovides essential information supporting the main text. a figure could be several images, a code snippet, audio, video, equations, a table, or something else. active learning: creating a figure in this active learning section, we'd like you to take the finished code from the previous active learning section, and turn it into a figure: wrap it in a <figure> element. copy the text out of the title attribute, remove the title attribute, and put the text inside a <figcaption> element below the image. if you make a mistake, you can always reset it using the reset button. if you get really stuck, press the show solution button to see an answer: playable code 2 <h2>live output</h2> <div class="output" style="min-height: 50px;"> </div> <h2>editable code</h2> <p class="a11y-label">press esc...

Using IndexedDB - Web APIs
for the data if (cursor) { console.log("displaypublist cursor:", cursor); req = store.get(cursor.key); req.onsuccess = function (evt) { var value = evt.target.result; var list_item = $('<li>' + '[' + cursor.key + '] ' + '(biblioid: ' + value.biblioid + ') ' + value.title + '</li>'); if (value.year != null) list_item.append(' - ' + value.year); if (value.hasownproperty('blob') && typeof value.blob != 'undefined') { var link = $('<a href="' + cursor.key + '">file</a>'); link.on('click', function() { return false; }); link.on('mouseenter', function(evt) { ...
...the resource behind this url is subjected to the * "same origin policy", thus for this method to work, the url must come from * the same origin as the web site/app this code is deployed on. */ function addpublicationfromurl(biblioid, title, year, url)...
...{ // console.log("blob retrieved"); // console.log("blob:", data); // // addpublication(biblioid, title, year, data); // }, // error: function(jqxhr, textstatus, errorthrown) { // console.error(errorthrown); // displayactionfailure("error during blob retrieval"); // } // }); } /** * @param {string} biblioid * @param {string} title * @param {number} year * @param {blob=} blob */ function addpublication(biblioid, title, year, blob) { console.log("addpublication arguments:", arguments); var obj = { biblioid: biblioid, title: title, year: year }; if (typeof blob != 'undefined') obj.blob = blob; var store = getobjectstore(db_store_name, 'readwrite'); var req; try { req = store.add(...
...an>'); } function resetactionstatus() { console.log("resetactionstatus ..."); $('#msg').empty(); console.log("resetactionstatus done"); } function addeventlisteners() { console.log("addeventlisteners"); $('#register-form-reset').click(function(evt) { resetactionstatus(); }); $('#add-button').click(function(evt) { console.log("add ..."); var title = $('#pub-title').val(); var biblioid = $('#pub-biblioid').val(); if (!title || !biblioid) { displayactionfailure("required field(s) missing"); return; } var year = $('#pub-year').val(); if (year != '') { // better use number.isinteger if the engine has ecmascript 6 if (isnan(year)) { displayactionfailure("invalid year"); ...

Timing element visibility with the Intersection Observer API - Web APIs
xtarticleid; titleelem.innertext = "article " + nextarticleid + " title"; articleelem.appendchild(titleelem); articleelem.innerhtml += contents; nextarticleid +=1 ; return articleelem; } first, the <article> element is created and its id is set to the unique value nextarticleid (which starts at 1 and goes up for each article). then we create and append an <h2> element for the article title and then we append the html from contents to that. finally, nextarticleid is incremented (so that the next element gets a new unique id) and we return the new <article> element to the caller. creating an ad the loadrandomad() function simulates loading an ad and adding it to the page. if you don't pass a value for replacebox, a new element is created to contain the ad; the ad is then appended to...
...of gray: a novel", body: "love really does make the world go round..." }, { bgcolor: "#fee", title: "flexbox florist", body: "when life's layout gets complicated, send flowers." } ]; let adbox, title, body, timerelem; let ad = ads[math.floor(math.random()*ads.length)]; if (replacebox) { adobserver.unobserve(replacebox); adbox = replacebox; title = replacebox.queryselector(".title"); body = replacebox.queryselector(".body"); timerelem = replacebox.queryselector(".timer"); } else { adbox = document.createelement("div"); adbox.classname = "ad"; title = document.createelement("h2"); body = document.createelement("p"); timerelem = document.createelement("div"); adbox.appendchild(title); adbox.appendchild(b...
... } first is the array ads. this array contains the data needed to create each ad. we have four here to choose from at random. in a real-world scenario, of course, the ads would come from a database or, more likely, an advertising service from which you fetch ads using an api. however, our needs are simple: each ad is represented by an object with three properties: a background color (bgcolor), a title (title), and a body text string (body). then we define several variables: adbox this will be set to the element that represents the ad. for new ads being appended to the page, this is created using document.createelement(). when replacing an existing ad, this is set to the specified ad element (replacebox). title will hold the <h2> element representing the ad's title. body will hold the <...
...bserver.unobserve(). then the local variables for each of the elements that comprise an ad: the ad box itself, the title, the body, and the timer box, are all set to the corresponding elements in the existing ad. if no value is specified for replacebox, we create a new ad element. the ad's new <div> element is created and its properties established by setting its class name to "ad". next, the ad title element is created, along with the body and the visibility timer; these are an <h2>, a <p>, and a <div> element, respectively. these elements are appended to the adbox element. after that, the code paths converge once again. the ad's background color is set to the value specified in the new ad's record, and elements' classes and contents are set appropriately as well. next, it's time to set up t...

Border-image generator - CSS: Cascading Style Sheets
box-shadow: 0 0 3px 0 #bababa; transition: all 0.25s; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } @media (min-width: 880px) { #controls .category { width: 30%; margin-left: 1.66%; margin-right: 1.66%; } } @media (max-width: 879px) { #controls .category { width: 37%; margin-left: 6.5%; margin-right: 6.5%; } } #controls .category .title { width: 100%; height: 30px; margin: 0 0 10px 0; line-height: 25px; text-align: center; color: #aaa; } #controls .category:hover .title { color: #777; } #controls .category > .group { border: 1px solid #ccc; border-radius: 2px; } /* property */ #controls .property { width: 250px; height: 20px; margin: 5px auto; } #controls .property .ui-input-slider { margin: 0; float: left; }...
...0px; } #aditional-properties .ui-input-slider > input { width: 80px !important; } /* unit settings panel */ #unit-settings { padding: 10px; position: absolute; background: #fff; font-size: 12px; border-radius: 3px; border: 1px solid #ccc; text-align: center; color: #555; position: absolute; z-index: 1000; box-shadow: 0 0 3px 0 #bababa; transition: all 0.25s; } #unit-settings .title { width: 100%; margin: -5px auto 0; color: #666; font-size: 14px; font-weight: bold; line-height: 25px; border-bottom: 1px solid #e5e5e5; } #unit-settings .ui-input-slider { margin: 10px 0 0 0; } #unit-settings .ui-input-slider-info { width: 50px; line-height: 1.5em; } #unit-settings input { font-size: 12px; width: 40px !important; } #unit-settings .close { width: 16px; height: ...
...t code */ #output { padding: 10px; border: 2px dashed #888 !important; box-shadow: none !important; border-radius: 3px; overflow: hidden; -moz-user-select: text; -webkit-user-select: text; -ms-user-select: text; user-select: text; } @media (min-width: 880px) { #output { width: 63.33% !important; } } @media (max-width: 879px) { #output { width: 87% !important; } } #output .title { width: 100%; height: 30px; margin: 0 0 10px 0; line-height: 25px; text-align: center; color: #aaa; } #output .css-property { width: 100%; margin: 0; color: #555; font-size: 14px; line-height: 18px; float: left; } #output .css-property .name { width: 30%; font-weight: bold; text-align: right; float: left; } #output .css-property .value { width: 65%; padding: 0 2.5%; word-br...
...unit_topic = topic; title.textcontent = topic; panel.setattribute('data-active', 'true'); panel.style.top = e.target.offsettop - 40 + 'px'; panel.style.left = e.target.offsetleft + 30 + 'px'; inputslidermanager.setvalue('unit-precision', precision); inputslidermanager.setvalue('unit-step', step); }; var init = function init() { panel = document.createelement('div'); title = document.createelement('div'); var close = document.createelement('div'); step = inputslidermanager.createslider('unit-step', 'step'); precision = inputslidermanager.createslider('unit-precision', 'precision'); inputslidermanager.setstep('unit-precision', 1); inputslidermanager.setmax('unit-precision', 2); inputslidermanager.setvalue('unit-precision', 2); inputslidermanage...

HTML documentation index - HTML: Hypertext Markup Language
le or files. this attribute and the <style> element have mainly the purpose of allowing for quick styling, for example for testing purposes. 31 tabindex global attributes, html, reference the tabindex global attribute indicates that its element can be focused, and where it participates in sequential keyboard navigation (usually with the tab key, hence the name). 32 title global attributes, html, reference, title the title global attribute contains text representing advisory information related to the element it belongs to. 33 translate experimental, global attributes, html, reference the translate global attribute is an enumerated attribute that is used to specify whether an element's translateable attribute values and its text node ...
...l addresses, locations in the same page, or anything else a url can address. 56 <abbr>: the abbreviation element acronym, definitions, element, html, html text-level semantics, html:flow content, html:palpable content, html:phrasing content, reference, web, abbr, abbreviation, semantics the html abbreviation element (<abbr>) represents an abbreviation or acronym; the optional title attribute can provide an expansion or description for the abbreviation. 57 <acronym> element, html, html:flow content, obsolete, reference, web the html acronym element (<acronym>) allows authors to clearly indicate a sequence of characters that compose an acronym or abbreviation for a word. 58 <address>: the contact address element address, author, contact, con...
...ement that displays its block-level or inline contents centered horizontally within its containing element. 79 <cite>: the citation element attribution, citation, citing references, citing works, element, html, html text-level semantics, quotations, reference, web the html citation element (<cite>) is used to describe a reference to a cited creative work, and must include the title of that work. 80 <code>: the inline code element code, element, html, html text-level semantics, inline code, reference, web the html <code> element displays its contents styled in a fashion intended to indicate that the text is a short fragment of computer code. 81 <col> element, html, html tabular data, reference, tables, web the html <col> element defin...
...ml tabular data, reference, tables, web the html <thead> element defines a set of rows defining the head of the columns of the table. 210 <time> element, html, html text-level semantics, html5, html:flow content, html:palpable content, html:phrasing content, reference, web the html <time> element represents a specific period in time. 211 <title>: the document title element element, html, html document metadata, html:metadata content, page name, page title, reference, tab name, tab title, title, web, window name, window title the html title element (<title>) defines the document's title that is shown in a browser's title bar or a page's tab. 212 <tr>: the table row element element, html, html tabular data, reference, tables, web, tag,...

windows - Archive of obsolete content
dow objects. var windows = require("sdk/windows"); for (let window of windows.browserwindows) { console.log(window.title); } console.log(windows.browserwindows.length); the currently active window is given by browserwindows.activewindow: var windows = require("sdk/windows").browserwindows; windows.on('activate', function(window) { console.log("a window was activated."); var activewindowtitle = windows.activewindow.title; console.log("active window title is: " + activewindowtitle); }); events the browserwindows property emits the following events which can be listened to using its on function. var windows = require("sdk/windows").browserwindows; // add a listener to the 'open' event windows.on('open', function(window) { myopenwindows.push(window); }); // add a listener to the ...
...t has become inactive. browserwindow a browserwindow instance represents a single open window. they can be retrieved from the browserwindows property exported by this module. var windows = require("sdk/windows").browserwindows; //print how many tabs the current window has console.log("the active window has " + windows.activewindow.tabs.length + " tabs."); // print the title of all browser windows for (let window of windows) { console.log(window.title); } // close the active window windows.activewindow.close(function() { console.log("the active window was closed"); }); methods activate() makes window active, which will focus that window and bring it to the foreground. close(callback) close the window. parameters callback : function a function to be called...
...ose the active window windows.activewindow.close(function() { console.log("the active window was closed"); }); methods activate() makes window active, which will focus that window and bring it to the foreground. close(callback) close the window. parameters callback : function a function to be called when the window finishes its closing process. this is an optional argument. properties title the current title of the window. usually the title of the active tab, plus an app identifier. this property is read-only. tabs a live list of tabs in this window. this object has the same interface as the tabs api, except it contains only the tabs in this window, not all tabs in all windows. this property is read-only. ...

ui/sidebar - Archive of obsolete content
this will be used for the label for your sidebar in the "sidebar" submenu in firefox, and will be shown at the top of your sidebar when it is open. url string the url of the content to load in the sidebar. this must be a local url (typically, loaded from the "data" folder using self.data.url()). from firefox 34, you can u...
...e("sdk/self").data.url("sidebar.html"), onattach: function (worker) { console.log("attaching"); }, onshow: function () { console.log("showing"); }, onhide: function () { console.log("hiding"); }, ondetach: function () { console.log("detaching"); } }); parameters options : object required options: name type title string a title for the sidebar. this will be used for the label for your sidebar in the "sidebar" submenu in firefox, and will be shown at the top of your sidebar when it is open. url string the url of the content to load in the sidebar. this must be a local url (typically, loaded from the "data" folder using self.data.url()). from firefox 34, you can use "./myfile.html" as an a...
... the listener function that handles the event. removelistener(type, listener) unregisters/removes an event listener from the sidebar. parameters type : string the type of event for which listener was registered. listener : function the listener function that was registered. properties id the id of the sidebar. this used to identify this sidebar in its chrome window. it must be unique. title the title of the sidebar. this will be used for the label for your sidebar in the "sidebar" submenu in firefox, and will be shown at the top of your sidebar when it is open. url the url of the content to load in the sidebar. this must be a local url (typically, loaded from the "data" folder using self.data.url()). events attach this event is emitted when a worker is attached to a sidebar, as...

ui/toolbar - Archive of obsolete content
r that, though, you can't show or hide the toolbar programmatically. toolbars get a close button at the right-hand side, and users can show or hide the toolbar using the firefox "view/toolbars" menu, alongside built-in toolbars like the bookmarks toolbar. hidden state persists even over create/destroy cycles: if a toolbar is created, then hidden, then destroyed, and another toolbar with the same title is then created, the new toolbar will be in the hidden state. toolbar events toolbars get attach and detach events when their content is loaded and unloaded, and show and hide events when the uses shows or hides them. working with multiple browser windows there's only a single toolbar for all browser windows, so operations like show and hide work across all browser windows. if you need to cust...
...this appears as the name of the toolbar in the firefox "toolbars" menu. it must be unique. optional options: name type items array adding buttons to toolbars is only supported from firefox 30 onwards. in firefox 29, you can only add frames. an array of items to appear in the toolbar. each ite...
...the listener is listening for. toolbar supports the following events: attach, detach, show, and hide. listener : function the listener to remove. destroy() destroys the toolbar. after calling this function, the toolbar will no longer be visible and its menu item will no longer appear in the firefox "toolbars" menu. calling this function also causes the detach event to be emitted. properties title the toolbar's title. this is read-only and must be unique. it's also not available until after the attach event is emitted. items the array of frames hosted by this toolbar. this property is read-only and is not available until after the attach event is emitted. hidden boolean indicating whether the toolbar is hidden. this property is read-only and is not available until after the attach even...

package.json - Archive of obsolete content
u run jpm init. it looks like this (assuming the add-on's directory is "my-addon"): { "name": "my-addon", "title": "my-addon", "id": "jid1-1fergv45e4f4f@jetpack", "description": "a basic add-on", "author": "", "license": "mpl-2.0", "version": "0.1" } if you are using the new jpm tool, you can easily access manifest data from package.json by requiring it like any other module: var title = require("./package.json").title; key reference package.json may contain the following keys: author the name of the package's original author; this could be the name of a person or a company. defaults to an empty string. it may include a optional url in parentheses and an email address in angle brackets. this value will be used as the add-on's em:creator element in the in...
...e add-on's meta data. main a string representing the name of a program module that is located in one of the top-level module directories specified by lib. defaults to "index.js". name the add-on's name. this name cannot contain spaces or periods, and defaults to the name of the parent directory. when the add-on is built as an xpi, if the fullname and title keys are not present, name is used as the add-on's em:name element in its install.rdf. packages note: this is deprecated along with cfx and is not available when using jpm. a string pointing to a directory containing additional packages. defaults to "packages". permissions an object describing the set of permissions that the add-on needs. ...
... preferencesurl the url where the "preferences" button of your add-on in the add-ons manager will point to. use this to specify a custom preferences page instead of the built-in ui provided by the add-on manager. preferences-branch use this to specify an alternative branch for your add-on's simple-prefs. see "simple-prefs in the preferences system" for more details. title the human-readable title of the package; this can contain spaces. if this key is present, its value will be used as the add-on's em:name element in its install.rdf. translators an array of strings listing the people who contributed to the localization of this add-on. these values will be used as the add-on's em:translator elements in its install.rdf. not...

Bookmarks - Archive of obsolete content
r bookmarksarray = bmsvc.getbookmarkidsforuri(uri, {}); after executing this code, the array bookmarksarray contains the ids of all bookmarks that refer to the specified uri (in this case, "http://google.com"). manipulating existing items there are a number of convenient methods you can use to make changes to existing bookmarks and bookmark folders. this section covers some of them. ...
...svc.getbookmarkidsforuri(uri, {}); after executing this code, the array bookmarksarray contains the ids of all bookmarks that refer to the specified uri (in this case, "http://google.com"). manipulating existing items there are a number of convenient methods you can use to make changes to existing bookmarks and bookmark folders. this section covers some of them. ...
...this case, "http://google.com"). manipulating existing items there are a number of convenient methods you can use to make changes to existing bookmarks and bookmark folders. this section covers some of them. the item title to change the title of a bookmark or bookmark folder, you use the nsinavbookmarksservice.setitemtitle() method. bmsvc.setitemtitle(newbkmkid, "new title"); this sets the title of the item referenced by the id newbkmkid to "new title". you can fetch the current title of an item using the nsinavbookmarksservice.getitemtitle() method: var thistitle = bmsvc.getitemtitle(newbkmkid); this code will display an alert containing the title of the item referenced by the id newbkmkid. the item uri similarly, you can obtain the uri corresponding to a given bookmark item by cal...

Bookmark Keywords - Archive of obsolete content
s been filed into a folder called "widgets." you can create a folder with another name, or not put your keymarks into a folder at all. changing the properties to alter the properties of the bookmark, highlight the bookmark and select the "properties..." button at the top of the bookmark manager. this will open up a dialog box that will let you edit the properties of the bookmark. the original title of the bookmark won't apply. you can name the bookmark whatever you want, but it's often handy to make the title very similar to the keyword you plan to use. that way, if you ever forget the keyword you've assigned to a bookmark, you only have to glance at the bookmark's title to remember the keyword. however, the two should not be a case-sensitive match-- that is, if your keyword is av, then your...
... here's where the power starts to show up. ...
...rch google directly form the address bar, go to google and run a search for any word. once you get a result page, bookmark that page. you'll need to replace the word for which you searched. one such example, with the relevant term highlighted, is shown in figure 7. once this result page has been bookmarked, we need only adjust the boookmark's properties. in this case, we'll give it a keyword and title of google and replace the term "geitost" with the %s, as shown (with extra highlighting) in figure 8. now we can run google searches straight from the address bar. these searches can be as complex as google will tolerate, since the entered data will be converted to url-encoded text before it's sent to the google servers. thus we could type any of the following into the address bar and get back us...

RDF Modifications - Archive of obsolete content
assuming that the 'obelisk' photo doesn't have a description already, adding the triple listed above should cause a new result to be available for this photo. the builder scans through the query statements one by one. the content tag can safely be skipped at this part of the process, so the builder moves onto the member statement. this type of statement can only ...
...ttp://www.xulplanet.com/ndeakin/images/t/obelisk.jpg, ?description = 'one of the thirty or so egyptian obelisks') next, the builder works its way backwards through the statements, in order to fill in the remaining variables. it does this in a similar manner as it does when it generates results, but traverses the statements in the opposite order. the previous triple will fill in a value for the ?title variable, since we now have a value for the ?photo variable referred to by the triple's subject attribute. next, the member statement is examined, and, in this situation, the builder fills in the known ?photo variable, and looks for a parent container containing this value. there is a container 'http://www.xulplanet.com/rdf/myphotos', so the ?start variable will be filled in with this value. now, ...
...ariable, and looks for a parent container containing this value. there is a container 'http://www.xulplanet.com/rdf/myphotos', so the ?start variable will be filled in with this value. now, the potential result so far is: (?photo = http://www.xulplanet.com/ndeakin/images/t/obelisk.jpg, ?description = 'one of the thirty or so egyptian obelisks', ?start = http://www.xulplanet.com/rdf/myphotos, ?title = 'obelisk') as you can see, the result looks to have all the information necessary to create a new item in the output. if a statement hadn't generated a result, for instance if the photo did not have a title, or it wasn't contained in a parent container, there would be no match and the builder could stop processing the new triple. for instance, we might have added a description for a new photo, ...

Simple Menu Bars - Archive of obsolete content
ed inside a toolbox and the menu would work just like any other toolbar. xul does have some special elements which provide special functionality typical of menus. there are five elements associated with creating a menu bar and its menus, which are explained briefly here and in detail afterwards: menubar the container for the row of menus. menu despite the name, this is actually only the title of the menu on the menubar. this element can be placed on a menubar or can be placed separately. menupopup the popup box that appears when you click on the menu title. this box contains the list of menu commands. menuitem an individual command on a menu. this would be placed in a menupopup. menuseparator a separator bar on a menu. this would be placed in a menupopup. you can cust...
...up> </menu> <menu id="edit-menu" label="edit"> <menupopup id="edit-popup"> <menuitem label="undo"/> <menuitem label="redo"/> </menupopup> </menu> </menubar> </toolbox> here, a simple menu bar is created using the menubar element. it will create a row for menus to be placed on. two menus, file and edit have been created here. the menu element creates the title at the top of the menu, which appears on the menu bar. the popups are created using the menupopup element. it will pop up when the user clicks on the parent menu title. the size of the popup will be large enough to fit the commands inside it. the commands themselves are created using the menuitem element. each one represents a single command on the menu popup. you can also create separators on th...
...g menus. note that it has been placed inside a flexible toolbox. the menubar has no special attributes but it is a type of box. this means that you could create a vertical menubar by setting the orient attribute to vertical. menu element the menu element works much like the button element. it accepts some of the same attributes plus some additional ones: id the unique identifier of the menu title button. label the text to appear on the menu, such as file or edit. disabled this boolean attribute determines whether the menu is disabled. although you can, there's rarely a need to disable an entire menu. this attribute can be set to either true or false. of course, the latter is the default. accesskey this is the key that the user can press to activate the menu item. this letter...

dialogheader - Archive of obsolete content
« xul reference home [ examples | attributes | properties | methods | related ] a heading row for a dialog box. this element should be placed inside a dialog element. the header may have a title and a description. ...
... « xul reference home [ examples | attributes | properties | methods | related ] a heading row for a dialog box. this element should be placed inside a dialog element. the header may have a title and a description. ...
...his maximum width, you may be able to use the max-width css property (or the maxwidth attribute) to override this size. for example, for a menuitem in a menu you can add the following css rule when you want to use the value none: menupopup > menuitem, menupopup > menu { max-width: none; } description type: string descriptive text to appear in addition to the dialog title. title type: string the text to appear in the title bar of the window. properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, ...

window - Archive of obsolete content
the root element of a xul document, which is intended to be loaded in a tab, to disable the find bar for the tab with this document. this is used to prevent the find bar from being displayed when it's not supported by the content (such as in the add-ons manager tab). drawintitlebar type: boolean if this attribute is true, the top of the window's content area will begin at the top edge of the title bar, instead of below the title bar. this allows the window to draw in the title bar. this is supported only from window elements, and is ignored on platforms that don't support drawing into the title bar. fullscreenbutton type: boolean set this attribute to true to display a button in the window chrome to allow the user to switch the window into full screen mode. supported on mac os x 10.7 l...
...mized, its persisted sizemode attribute wouldn't be minimized. setting this attribute does not change the window state. use window.maximize(), window.restore(), or window.minimize() to change the window state. to get the window state from javascript code, use window.windowstate. listen to the sizemodechange event dispatched to the dom window to get notified when the window state changes. title type: string the text to appear in the title bar of the window. width type: string (representing an integer) the preferred width of the element. the value should not include a unit as all values are in pixels. the actual displayed width may be different if the element or its contents have a minimum or maximum width, or the size is adjusted by the flexibility or alignment of its parent. t...
...fined entity...<window" can be caused by a missing or unreachable dtd file referenced in the xul file. a filename following the system keyword in a doctype declaration may silently fail to load and the only error message will be an undefined entity error on the next xul element. related elements prefwindow, dialog, dialogheader related topics user notes to change the icon to a window's title bar check this page on window icons. to add a favicon to the address bar and browser tab (ie dialog is not a popup) then use the following code snippet to use the html namespace and link. <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" xmlns:html="http://www.w3.org/1999/xhtml"> <!-- icon from chrome --> <html:link rel="icon" href="chrome://myextension/content/path...

Styling Abbreviations and Acronyms - Archive of obsolete content
s, but their styling can come as a surprise to authors. see how you can take control of their presentation without sacrificing the benefits these elements provide. many authors are beginning to use the html elements abbr (abbreviation) and acronym in their web pages. ...
...) and acronym in their web pages. ...
...this can be done with the following rule: abbr[title], acronym[title] { text-decoration: none; } it may be better to lessen the visual weight of the border without actually removing it. the underline tells readers that the word in question has extra information associated with it. in mozilla, placing the mouse pointer over the element and leaving it for a moment will cause the contents of the title attribute to appear as a tooltip next to the mouse pointer. removing the underline from these elements will rob readers of an indication that there is extra information available. related links web content accessibility guidelines 1.0 original document information author(s): eric a. meyer, netscape communications last updated date: published 09 aug 2002 copyright information: copyright...

HTML basics - Learn web development
previous overview: getting started with the web next html (hypertext markup language) is the code that is used to structure a web page and its content. for example, content could be structured within a set of paragraphs, a list of bulleted points, or using images and data tables. as the title suggests, this article will give you a basic understanding of html and its functions. so what is html? html is not a programming language; it is a markup language that defines the structure of your content. html consists of a series of elements, which you use to enclose, or wrap, different parts of the content to make it appear a certain way, or act a certain way. the enclosing tags can make a word or image hyperlink to somewhere else, can italicize words, can make the font bigger or smaller, ...
...ations and more. <meta charset="utf-8"> — this element sets the character set your document should use to utf-8 which includes most characters from the vast majority of written languages. essentially, it can now handle any textual content you might put on it. there is no reason not to set this and it can help avoid some problems later on. <title></title> — the <title> element. this sets the title of your page, which is the title that appears in the browser tab the page is loaded in. it is also used to describe the page when you bookmark/favourite it. <body></body> — the <body> element. this contains all the content that you want to show to web users when they visit your page, whether that's text, images, videos, games, playable audio tracks or whatever else. images let's turn our att...
...y that certain parts of your content are headings — or subheadings. in the same way that a book has the main title, chapter titles and subtitles, an html document can too. html contains 6 heading levels, <h1>–<h6>, although you'll commonly only use 3 to 4 at most: <h1>my main title</h1> <h2>my top level heading</h2> <h3>my subheading</h3> <h4>my sub-subheading</h4> now try adding a suitable title to your html page just above your <img> element. note: you'll see that your heading level 1 has an implicit style. don't use heading elements to make text bigger or bold, because they are used for accessibility and other reasons such as seo. try to create a meaningful sequence of headings on your pages, without skipping levels. paragraphs as explained above, <p> elements are for containing pa...

Advanced text formatting - Learn web development
owsers, screenreaders, etc. don't really do much with it. there is no way to get the browser to display the contents of cite, without writing your own solution using javascript or css. if you want to make the source of the quotation available on the page you need to make it available in the text via a link or some other appropriate way. there is a <cite> element, but this is meant to contain the title of the resource being quoted, e.g. the name of the book. there is no reason however why you couldn't link the text inside <cite> to the quote source in some way: <p>according to the <a href="/docs/web/html/element/blockquote"> <cite>mdn blockquote page</cite></a>: </p> <blockquote cite="/docs/web/html/element/blockquote"> <p>the <strong>html <code>&lt;blockquote&gt;</code> element</strong> (or...
... q page</cite></a>.</p> citations are styled in italic font by default. active learning: who said that? time for another active learning example! in this example we'd like you to: turn the middle paragraph into a blockquote, which includes a cite attribute. turn "the need to eliminate negative self talk" in the third paragraph into an inline quote, and include a cite attribute. wrap the title of each source in <cite> tags and turn each one into a link to that source. the citation sources you need are: http://www.brainyquote.com/quotes/authors/c/confucius.html for the confucius quote http://www.affirmationsforpositivethinking.com for "the need to eliminate negative self talk". if you make a mistake, you can always reset it using the reset button. if you get really stuck, press t...
...on is not saved over the user code if(solution.value === 'show solution') { userentry = textarea.value; } else { solutionentry = textarea.value; } updatecode(); }; abbreviations another fairly common element you'll meet when looking around the web is <abbr> — this is used to wrap around an abbreviation or acronym, and provide a full expansion of the term (included inside a title attribute.) let's look at a couple of examples: <p>we use <abbr title="hypertext markup language">html</abbr> to structure our web documents.</p> <p>i think <abbr title="reverend">rev.</abbr> green did it in the kitchen with the chainsaw.</p> these will come out looking something like this (the expansion will appear in a tooltip when the term is hovered over): note: there is another eleme...

Creating hyperlinks - Learn web development
ng the text or other content, see block level links, inside an <a> element and using the href attribute, also known as a hypertext reference, or target, that contains the web address. <p>i'm creating a link to <a href="https://www.mozilla.org/">the mozilla homepage</a>. </p> this gives us the following result: i'm creating a link to the mozilla homepage. adding supporting information with the title attribute another attribute you may want to add to your links is title. the title contains additional information about the link, such as which kind of information the page contains, or things to be aware of on the web site. <p>i'm creating a link to <a href="https://www.mozilla.org/" title="the best place to find more information about mozilla's mission and how to contribute">the m...
... information about the link, such as which kind of information the page contains, or things to be aware of on the web site. <p>i'm creating a link to <a href="https://www.mozilla.org/" title="the best place to find more information about mozilla's mission and how to contribute">the mozilla homepage</a>. </p> this gives us the following result and hovering over the link displays the title as a tooltip. i'm creating a link to the mozilla homepage. note: a link title is only revealed on mouse hover, which means that people relying on keyboard controls or touchscreens to navigate web pages will have difficulty accessing title information. if a title's information is truly important to the usability of page, then you should present it in a manner that will be accessible to all users...
...ld present it in a manner that will be accessible to all users, for example by putting it in the regular text. active learning: creating your own example link create an html document using your local code editor and our getting started template. inside the html body, add one or more paragraphs or other types of content you already know about. change some of the content into links. include title attributes. block level links as mentioned before, almost any content can be made into a link, even block-level elements. if you have an image you want to make into a link, use the <a> element and reference the image file with the <img> element. <a href="https://www.mozilla.org/"> <img src="mozilla-image.png" alt="mozilla logo that links to the mozilla homepage"> </a> note: you'll find out...

HTML text fundamentals - Learn web development
hs most structured text consists of headings and paragraphs, whether you are reading a story, a newspaper, a college textbook, a magazine, etc. structured content makes the reading experience easier and more enjoyable. ...
...somewhere, an owl hooted. ...
...> there are six heading elements: <h1>, <h2>, <h3>, <h4>, <h5>, and <h6>. each element represents a different level of content in the document; <h1> represents the main heading, <h2> represents subheadings, <h3> represents sub-subheadings, and so on. implementing structural hierarchy for example, in this story, the <h1> element represents the title of the story, the <h2> elements represent the title of each chapter, and the <h3> elements represent sub-sections of each chapter: <h1>the crushing bore</h1> <p>by chris mills</p> <h2>chapter 1: the dark night</h2> <p>it was a dark night. somewhere, an owl hooted. the rain lashed down on the ...</p> <h2>chapter 2: the eternal silence</h2> <p>our protagonist could not so much as a whisper out of the shadowy figure ...</p> <h3>the specter spea...

Client-side storage - Learn web development
of what it is capable of, but we will give you enough to get started. working through a note storage example here we'll run you through an example that allows you to store notes in your browser and view and delete them whenever you like, getting you to build it up for yourself and explaining the most fundamental parts of idb as we go along. the app looks something like this: each note has a title and some body text, each individually editable. the javascript code we'll go through below has detailed comments to help you understand what's going on. getting started first of all, make local copies of our index.html, style.css, and index-start.js files into a new directory on your local machine. have a look at the files. you'll see that the html is pretty simple: a web site with a header a...
...e that the html is pretty simple: a web site with a header and footer, as well as a main content area that contains a place to display notes, and a form for entering new notes into the database. the css provides some simple styling to make it clearer what is going on. the javascript file contains five declared constants containing references to the <ul> element the notes will be displayed in, the title and body <input> elements, the <form> itself, and the <button>. rename your javascript file to index.js. you are now ready to start adding code to it. database initial set up now let's look at what we have to do in the first place, to actually set up a database. below the constant declarations, add the following lines: // create an instance of a db object for us to store the open data...
...s, and also specified an autoincrement key field called id — in each new record this will automatically be given an incremented value — the developer doesn't need to set this explicitly. being the key, the id field will be used to uniquely identify records, such as when deleting or displaying a record. we also create two other indexes (fields) using the idbobjectstore.createindex() method: title (which will contain a title for each note), and body (which will contain the body text of the note). so with this simple database schema set up, when we start adding records to the database; each one will be represented as an object along these lines: { title: "buy milk", body: "need both cows milk and soy.", id: 8 } adding data to the database now let's look at how we can add records...

mozbrowsertitlechange
the contents of the <title> element) changes. ...
...e properties property type description target read only eventtarget the browser iframe type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. ...
... event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. detail read only string the title of the document. ...

TPS Tests
tps addon so that other tests can use it. example test here's an example tps test to tie it all together. ...
...ri: "http://www.yahoo.com", title: "testing yahoo", changes: { location: "menu/folderb" } } ] }; // the state of bookmarks after the first 'modify' action has been performed // on them. ...
...ncing, in case the sync account already contains data (this is typically unnecessary, and done largely as an example). firefox closes. firefox is launched with profile2, and all data is synced from the sync server. the tps extension verifies that all bookmarks in the bookmarks_initial list are present. then it modifies those bookmarks by applying the "changes" property to each of them. e.g., the title of the first bookmark is changed from "google.com" to "google". next, the changes are synced to the sync server. finally, firefox closes. firefox is launched with profile1 again, and data is synced from the sync server. the tps extension verifies that the bookmarks in bookmarks_after_first_modify list are present; i.e., all the changes performed in profile2 have successfully been synced to profil...

Gecko Roles
« at apis support page this page offers a list of accessible roles used in gecko. role constants are defined in the nsiaccessiblerole interface. role_nothing used when the accessible item doesn't have a strongly defined role. role_titlebar represents a title or caption bar for a window. used by msaa only, this is supported automatically by microsoft windows. role_menubar represents the menu bar (positioned beneath the title bar of a window on most platforms or at the top of the screen on mac os x) from which menus are selected by the user. role_scrollbar represents a vertical or horizontal scroll bar, which is part of the client area or used in a control. role_grip represents a special mouse pointer, which allows a user to manipulate user interfa...
... role_caret represents the system caret. role_alert represents an alert or a condition that a user should be notified about. assistive technologies typically respond to the role by reading the entire onscreen contents of containers advertising this role. should be used for warning dialogs, etc. role_window represents the window frame, which contains child objects such as a title bar, client, and other objects contained in a window. the role is supported automatically by microsoft windows. role_internal_frame a sub-document. role_menupopup represents a menu, which presents a list of options from which the user can make a selection to perform an action. role_menuitem represents a menu item, which is an entry in a menu that a user can choose to carry ...
...pecialized dialog that displays the files in the directory and lets the user select a file, browse a different directory, or specify a filename. may use the directory pane to show the contents of a directory. role_font_chooser a font chooser. a font chooser is a component that lets the user pick various attributes for fonts. role_chrome_window frame role. a top level window with a title bar, border, menu bar, etc. it is often used as the primary window for an application. role_glass_pane a glass pane. a pane that is guaranteed to be painted on top of all panes beneath it. role_html_container a document container for html, whose children represent the document content. role_icon a small fixed size picture, typically used to decorate components. role_lab...

Feed content access API
ct. ...
...oc.write("<blockquote>" + info); doc.write("</blockquote><p>"); } } } // close the document; we're done! doc.write("</body></html>"); doc.close(); } } the handleresult() function receives as its argument an nsifeedresult that describes a feed; its doc property is an nsifeed that contains all the feed data. to get the title of the feed, you look at the feed.title property. the title is an nsifeedtextconstruct that can represent the text in various formats; we get its text property to fetch the feed's title as html-encoded text. we could, alternatively, use its plaintext() method to get a copy of the title translated into plain text. we then scan the array of items in the feed by looking at the feed.items nsiarray. th...
...array. this array contains nsifeedentry objects that describe each feed item. we build the contents of the document by looking at the title, link, summary, and content properties for each item. the full url of the link is retrieved using the link's resolve() method. to initialize a fetch of the feed, we simply call fetch(url). this opens a new window containing the feed contents, with each item's title a clickable link that takes you to the article itself. for details on each of the feed access interfaces, visit their respective reference pages. ...

Manipulating bookmarks using Places
r bookmarksarray = bmsvc.getbookmarkidsforuri(uri, {}); after executing this code, the array bookmarksarray contains the ids of all bookmarks that refer to the specified uri (in this case, "http://google.com"). manipulating existing items there are a number of convenient methods you can use to make changes to existing bookmarks and bookmark folders. this section covers some of them. ...
...svc.getbookmarkidsforuri(uri, {}); after executing this code, the array bookmarksarray contains the ids of all bookmarks that refer to the specified uri (in this case, "http://google.com"). manipulating existing items there are a number of convenient methods you can use to make changes to existing bookmarks and bookmark folders. this section covers some of them. ...
...this case, "http://google.com"). manipulating existing items there are a number of convenient methods you can use to make changes to existing bookmarks and bookmark folders. this section covers some of them. the item title to change the title of a bookmark or bookmark folder, you use the nsinavbookmarksservice.setitemtitle() method. bmsvc.setitemtitle(newbkmkid, "new title"); this sets the title of the item referenced by the id newbkmkid to "new title". you can fetch the current title of an item using the nsinavbookmarksservice.getitemtitle() method: var thistitle = bmsvc.getitemtitle(newbkmkid); this code will display an alert containing the title of the item referenced by the id newbkmkid. the item uri similarly, you can obtain the uri corresponding to a given bookmark item by cal...

nsIAccessibleRole
accessible/public/nsiaccessiblerole.idlscriptable this interface defines cross platform (gecko) roles. 1.0 66 introduced gecko 1.9 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) constants constant value description role_nothing 0 used when accessible has no strong defined role. role_titlebar 1 represents a title or caption bar for a window. it is used by msaa only, supported automatically by ms windows. role_menubar 2 represents the menu bar (positioned beneath the title bar of a window) from which menus are selected by the user. the role is used by xul:menubar or role="menubar". role_scrollbar 3 represents a vertical or horizontal scroll bar, which is part of the client area or used in a control. r...
... represents an alert or a condition that a user should be notified about. assistive technologies typically respond to the role by reading the entire on screen contents of containers advertising this role. should be used for warning dialogs, etc. the role is used by xul:browsermessage, role="alert", xforms:message. role_window 9 represents the window frame, which contains child objects such as a title bar, client, and other objects contained in a window. the role is supported automatically by ms windows. role_internal_frame 10 a sub-document or iframe. role_menupopup 11 represents a menu, which presents a list of options from which the user can make a selection to perform an action. it is used for role="menu". role_menuitem 12 represents a menu item, which is an entry in a menu that a use...
...ys the files in the directory and lets the user select a file, browse a different directory, or specify a filename. may use the directory pane to show the contents of a directory. also refer to role_directory_pane. role_font_chooser 74 a font chooser. a font chooser is a component that lets the user pick various attributes for fonts. role_chrome_window 75 frame role. a top level window with a title bar, border, menu bar, etc. it is often used as the primary window for an application. role_glass_pane 76 a glass pane. a pane that is guaranteed to be painted on top of all panes beneath it. also refer to role_root_pane. role_html_container 77 a document container for html, whose children represent the document content. role_icon 78 a small fixed size picture, typically used to decorate com...

nsIAlertsService
text, in boolean textclickable, optional in astring cookie, optional in nsiobserver alertlistener, optional in astring name, optional in astring dir, optional in astring lang, optional in astring data, optional in nsiprincipal principal, optional in boolean inprivatebrowsing, optional ); parameters imageurl a url identifying the image to display in the notification alert. title the title for the alert. text the text to display in the alert, explaining the alert condition. the text must not be too long, otherwise it might be truncated to a platform-specific length. if the text is too long, try to use line returns in the text to have it split and displayed over multiple lines. textclickable optional if true, if the user clicks on it, the listener is notified; when hov...
...s not displayed in the alert. however, certain notification systems (such as growl on mac os x) allow the user to disable alerts by name. this name is used in that configuration panel. on android the name is hashed and used as a notification id. dir optional bidi override for the title. valid values are "auto", "ltr" or "rtl". only available on supported platforms. lang optional language of title and text of the alert. only available on supported platforms. data optional the value of the cookie parameter passed to showalertnotification. principal optional the principal of the page that created the alert. used for ipc security checks, and to determine whether the alert is actionable. inprivatebrowsing optional controls the image loading behavior. if true, the image url will be loaded ...
...ages. click here to focus the tab', true, null, notiflistener, 'stackoverflow notifier'); closealert() closes alerts created by the service. void closealert( in astring name, optional in nsiprincipal principal optional ); parameters name the name of the notification to close. if no name is provided then only a notification created with no name (if any) will be closed. principal the title for the alert. see also alerts and notifications bug 782211 - implement notification api spec ui.alertnotificationorigin [en-us] bug 1270819 - nsialertsservice showalertnotification sliding alert unnecessarily big / high ...

nsIAuthPrompt
1 saves the password for the session. save_password_permanently 2 saves the password permanently. methods prompt() this method puts up a text input dialog with ok and cancel buttons. boolean prompt( in wstring dialogtitle, in wstring text, in wstring passwordrealm, in pruint32 savepassword, in wstring defaulttext, out wstring result ); parameters dialogtitle the title of the dialog. text the text of the prompt message dialog box. passwordrealm the password realm. for example, ldap://localhost/dc=test. savepassword saving password option. one of the save_password_* constants defaulttext the default text for the text input dialog box. result the result of the dialog box, ok or cancel buttons. return value true for ok, false for cancel. pr...
...og box, ok or cancel buttons. return value true for ok, false for cancel. promptpassword() this method puts up a password dialog with ok and cancel buttons. note: if a username is specified, the username should be escaped. boolean promptpassword( in wstring dialogtitle, in wstring text, in wstring passwordrealm, in pruint32 savepassword, inout wstring pwd ); parameters dialogtitle the title of the dialog. text the text of the prompt message dialog box. passwordrealm the password realm. for example, ldap://localhost/dc=test. if a username is specified (http://user@site.com) it will be used when matching existing logins or saving new ones. if no username is specified, only password-only logins will be matched or saved. savepassword saving password option. one of the sa...
...ord entered by the user if ok was selected. return value true for ok, false for cancel. promptusernameandpassword() this method puts up a username/password dialog with ok and cancel buttons. boolean promptusernameandpassword( in wstring dialogtitle, in wstring text, in wstring passwordrealm, in pruint32 savepassword, inout wstring user, inout wstring pwd ); parameters dialogtitle the title of the dialog. text the text of the prompt message dialog box. passwordrealm the password realm. for example, ldap://localhost/dc=test. savepassword saving password option. one of the save_password_* constants user the username entered in the dialog. pwd the password entered by the user if ok was selected. return value true for ok, false for cancel. ...

nsINavHistoryQueryOptions
nes. does nothing for bookmark queries. defaults to false. maxresults long this is the maximum number of results that you want. the query is exeucted, the results are sorted, and then the top maxresults results are taken and returned. set to "0" (the default) to get all results. this does not work in conjunction with sorting by title. this is because sorting by title requires us to sort after using locale-sensetive sorting (as opposed to letting the database do it for us). instead, we get the result ordered by date, pick the maxresult most recent ones, and then sort by title. querytype short the type of search to use when querying the db; this attribute is only honored by query nodes. it is silently ignored for simple folder ...
...der queries. see query type constants for possible values. redirectsmode unsigned short specifies how to handle redirects; see redirects mode constants for details. the default value is redirects_mode_all. note: this option is only used on query_type_history. resolvenullbookmarktitles boolean if a bookmark title is null (note, not empty), attempt to use the history title. it is set to false by default. resulttype short sets the result type. see result type constants for possible values. showsessions boolean separate/group history items based on session information. only matters when sorting by date. sortingannotation autf8string...
...g the annotation to use in sort_by_annotation_* sorting modes. sortingmode short the sorting annotation to use; see sorting methods for possible values. constants sorting methods you can ask for the results to be pre-sorted. since the db has indices of many items, it can produce sorted results almost for free. note: re-sorting is slower, as is sorting by title or when you have a host name. constant value description sort_by_none 0 for bookmark items, this constant means sort by the natural bookmark order. sort_by_title_ascending 1 sort by the ascending title order. sort_by_title_descending 2 sort by the descending title order. s...

Working with the History API - Web APIs
contents manually upon receiving the popstate event. note: calling history.back() normally behaves the same way as clicking the back button. but there is one important exception: after using history.pushstate(), calling history.back() does not raise a popstate event. clicking the browser's back button (still) does. the pushstate() method pushstate() takes three parameters: a state object; a title (currently ignored); and (optionally), a url. let's examine each of these three parameters in more detail. state object the state object is a javascript object which is associated with the new history entry created by pushstate(). whenever the user navigates to the new state, a popstate event is fired, and the state property of the event contains a copy of the history entry's state object. ...
...he user's disk so they can be restored after the user restarts the browser, we impose a size limit of 640k characters on the serialized representation of a state object. if you pass a state object whose serialized representation is larger than this to pushstate(), the method will throw an exception. if you need more space than this, you're encouraged to use sessionstorage and/or localstorage. title all browsers but safari currently ignore this parameter, although they may use it in the future. passing the empty string here should be safe against future changes to the method. alternatively, you could pass a short title for the state to which you're moving. url the new history entry's url is given by this parameter. note that the browser won't attempt to load this url after a call to pus...
...tion keeps you at the same document only if you modify only the hash. you don't have to change the url if you don't want to. in contrast, setting window.location = "#foo"; creates a new history entry only if the current hash isn't #foo. you can associate arbitrary data with your new history entry. with the hash-based approach, you need to encode all of the relevant data into a short string. if title is subsequently used by browsers, this data can be utilized (independent of, say, the hash). note that pushstate() never causes a hashchange event to be fired, even if the new url differs from the old url only in its hash. in a xul document, it creates the specified xul element. in other documents, it creates an element with a null namespace uri. the replacestate() method history.replacestat...

History API - Web APIs
current page is loaded in). examples the following example assigns a listener to the onpopstate property. and then illustrates some of the methods of the history object to add, replace, and move within the browser history for the current tab. ...
...ing example assigns a listener to the onpopstate property. and then illustrates some of the methods of the history object to add, replace, and move within the browser history for the current tab. ...
...rty. and then illustrates some of the methods of the history object to add, replace, and move within the browser history for the current tab. ...

IDBObjectStore.put() - Web APIs
ests a given record title; when that request is successful the onsuccess function gets the associated record from the idbobjectstore (made available as objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store in another request with put(). ...
...pdates one property of the record, and then puts the updated record back into the object store in another request with put(). ...
...perty of the record, and then puts the updated record back into the object store in another request with put(). ...

IDBRequest.onerror - Web APIs
nsuccess gets the associated record from the idbobjectstore (made available as objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store. also included at the bottom is an onerror function that reports what the error was if the request fails. ...
...k into the object store. also included at the bottom is an onerror function that reports what the error was if the request fails. ...
...ect store. also included at the bottom is an onerror function that reports what the error was if the request fails. ...

IDBRequest.onsuccess - Web APIs
est.onsuccess = function(event) { ... }; example the following example requests a given record title, onsuccess gets the associated record from the idbobjectstore (made available as objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store. ...
...objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store. ...
...lerequest.result), updates one property of the record, and then puts the updated record back into the object store. ...

IDBRequest.readyState - Web APIs
record title, onsuccess gets the associated record from the idbobjectstore (made available as objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store in another request. the readystate of the 2nd request is logged to the developer console. ...
...dated record back into the object store in another request. the readystate of the 2nd request is logged to the developer console. ...
...ack into the object store in another request. the readystate of the 2nd request is logged to the developer console. ...

IDBRequest.result - Web APIs
r myresult = request.result; value any example the following example requests a given record title, onsuccess gets the associated record from the idbobjectstore (made available as objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store. ...
...objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store. ...
...lerequest.result), updates one property of the record, and then puts the updated record back into the object store. ...

IDBRequest.source - Web APIs
iven record title, onsuccess gets the associated record from the idbobjectstore (made available as objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store in another request. the source of the 2nd request is logged to the developer console. ...
...e updated record back into the object store in another request. the source of the 2nd request is logged to the developer console. ...
...ord back into the object store in another request. the source of the 2nd request is logged to the developer console. ...

IDBRequest.transaction - Web APIs
ciated record from the idbobjectstore (made available as objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store in another request. the source of the requests is logged to the developer console — both originate from the same transaction. ...
...e in another request. the source of the requests is logged to the developer console — both originate from the same transaction. ...
...equest. the source of the requests is logged to the developer console — both originate from the same transaction. ...

MediaMetadata - Web APIs
mediametadata.artist returns or sets the name of the artist, group, creator, etc. of the media to be played. mediametadata.album returns or sets the name of the album or collection containing the media to be played. ...
... mediametadata.artist returns or sets the name of the artist, group, creator, etc. of the media to be played. mediametadata.album returns or sets the name of the album or collection containing the media to be played. ...
... webview android no support nochrome android full support 57firefox android ? opera android no support nosafari ios ? samsung internet android full support 7.0title experimentalchrome full support 57edge no support nofirefox full support 71ie no support noopera full support yessafari ? webview android ...

Notification.Notification() - Web APIs
options optional an options object containing any custom settings that you want to apply to the notification. the possible options are: dir: the direction in which to display the notification. ...
... options optional an options object containing any custom settings that you want to apply to the notification. the possible options are: dir: the direction in which to display the notification. ...
...y the user. silent: a boolean specifying whether the notification is silent (no sounds or vibrations issued), regardless of the device settings. the default is false, which means it won't be silent. example in our emogotchi demo (see source code), we run a spawnnotification() function when we want to trigger a notification. the function is passed parameters to specify the body, icon, and title we want, and then it creates the necessary options object and triggers the notification by using the notification() constructor. function spawnnotification(thebody,theicon,thetitle) { var options = { body: thebody, icon: theicon } var n = new notification(thetitle,options); } specifications specification status comment notifications apithe definitio...

PopStateEvent - Web APIs
did until version 10.0. syntax window.onpopstate = funcref; funcref is a handler function. ...
... = funcref; funcref is a handler function. ...
...pstate event as an example, a page at http://example.com/example.html running the following code will generate alerts as indicated: window.onpopstate = function(event) { alert("location: " + document.location + ", state: " + json.stringify(event.state)); }; history.pushstate({page: 1}, "title 1", "?page=1"); history.pushstate({page: 2}, "title 2", "?page=2"); history.replacestate({page: 3}, "title 3", "?page=3"); history.back(); // alerts "location: http://example.com/example.html?page=1, state: {"page":1}" history.back(); // alerts "location: http://example.com/example.html, state: null history.go(2); // alerts "location: http://example.com/example.html?page=3, state: {"page":3} note that even though the original history entry (for http://example.com/example.html) has no state object as...

Web Video Text Tracks Format (WebVTT) - Web APIs
in a cue, as seen below (see cue settings for more information): webvtt 00:00:00.000 --> 00:00:04.000 position:10%,line-left align:left size:35% where did he go? 00:00:03.000 --> 00:00:06.500 position:90% align:right size:35% i think he went down this lane. 00:00:04.000 --> 00:00:06.500 position:45%,line-right align:center size:35% what are you waiting for? webvtt cues a cue is a single subtitle block that has a single start time, end time, and textual payload. example 6 consists of the header, a blank line, and then five cues separated by blank lines. a cue consists of five components: an optional cue identifier followed by a newline. cue timings. optional cue settings with at least one space before the first and between each setting. one or more newlines. the cue payload text. ...
..., end time, and textual payload. example 6 consists of the header, a blank line, and then five cues separated by blank lines. a cue consists of five components: an optional cue identifier followed by a newline. cue timings. optional cue settings with at least one space before the first and between each setting. one or more newlines. the cue payload text. example 7 - example of a cue 1 - title crawl 00:00:05.000 --> 00:00:10.000 line:0 position:20% size:60% align:start some time ago in a place rather distant.... cue identifier the identifier is a name that identifies the cue. it can be used to reference the cue from a script. it must not contain a newline and cannot contain the string "-->". it must end with a single newline. they do not have to be unique, although it is common to num...
...me time ago in a place rather distant.... cue identifier the identifier is a name that identifies the cue. it can be used to reference the cue from a script. it must not contain a newline and cannot contain the string "-->". it must end with a single newline. they do not have to be unique, although it is common to number them (e.g., 1, 2, 3, ...). example 8 - cue identifier from example 7 1 - title crawl example 9 - common usage of identifiers webvtt 1 00:00:22.230 --> 00:00:24.606 this is the first subtitle. 2 00:00:30.739 --> 00:00:34.074 this is the second. 3 00:00:34.159 --> 00:00:35.743 third cue timings a cue timing indicates when the cue is shown. it has a start and end time which are represented by timestamps. the end time must be greater than the start time, and the start ti...

WindowEventHandlers.onpopstate - Web APIs
story entries for the same document. syntax window.onpopstate = funcref; funcref is a handler function. ...
...w.onpopstate = funcref; funcref is a handler function. ...
...on. ...

ARIA: dialog role - Accessibility
able to receive focus, it still needs to be labeled. the label given to the dialog will provide contextual information for the interactive controls inside the dialog. in other words, the dialog's label acts like a grouping label for the controls inside it (similar to how a <legend> element provides a grouping label for the controls inside a <fieldset> element). if a dialog already has a visible title bar, the text inside that bar can be used to label the dialog itself. the best way to achieve this is by using the aria-labelledby attribute to the role="dialog" element. additionally, if the dialog contains additional descriptive text besides the dialog title, this text can be associated with the dialog using the aria-describedby attribute. this approach is shown in the code snippet below: <div ...
... the aria-describedby attribute. this approach is shown in the code snippet below: <div role="dialog" aria-labelledby="dialog1title" aria-describedby="dialog1desc"> <h2 id="dialog1title">your personal details were successfully updated</h2> <p id="dialog1desc">you can change your details at any time in the user account section.</p> <button>close</button> </div> keep in mind that a dialog's title and description text do not have to be focusable in order to be perceived by screen readers operating in a non-virtual mode. the combination of the aria dialog role and labeling techniques should make the screen reader announce the dialog's information when focus is moved into it. required javascript features focus management a dialog has particular requirements for how keyboard focus should b...
...l dialogs there will have to be a global keyboard shortcut that allows focus to be moved between opened dialogs and the main page. for more information see the managing modal and non modal dialogs guide. associated aria roles, states, and properties aria-labelledby use this attribute to label the dialog. often, the value of the aria-labelledby attribute will be the id of the element used to title the dialog. aria-describedby use this attribute to describe the contents of the dialog. possible effects on user agents and assistive technology when the dialog role is used, the user agent should do the following: expose the element as a dialog in the operating system's accessibility api. when the dialog is correctly labeled and focus is moved to an element (often an interactive elemen...

Alternative style sheets - CSS: Cascading Style Sheets
you can try out. details any stylesheet in a document falls into one of the following categories: persistent (no rel="alternate", no title=""): always applies to the document. preferred (no rel="alternate", with title="..." specified): applied by default, but disabled if an alternate stylesheet is selected. ...
...tylesheet is selected. there can only be one preferred stylesheet, so providing stylesheets with different title attributes will cause some of them to be ignored. see correctly using titles with external stylesheets for a more detailed discussion. alternate (rel="alternate stylesheet", title="..." must be specified): disabled by default, can be selected. when style sheets are referenced with a title attribute on the <link rel="stylesheeet"> or <style> element, the title becomes one of the choices offered to the user. style sheets linked with the same title are part of the same choice. style sheets linked without a title attribute are always applied. use rel="stylesheet" to link to the default style, and rel="alternate stylesheet" to link to alternative style sheets. this tells the browser wh...
... specifications specification status comment html living standardthe definition of 'link type "alternate"' in that specification. ...

Using HTML sections and outlines - Developer guides
ction>, <aside>, and <nav> can have their own <footer>. despite its name, the footer is not necessarily positioned at the end of a page or section. ...
...ctional elements work? ...
... <nav> <ul> <li><a href="#">link</a></li>...

<dfn>: The Definition element - HTML: Hypertext Markup Language
t, but no <dfn> element must be a descendant. tag omission none, both the starting and ending tag are mandatory. permitted parents any element that accepts phrasing content. implicit aria role term permitted aria roles any dom interface htmlelement attributes this element's attributes include the global attributes. in html5, the title attribute has special meaning, as noted below. usage notes there are some not-entirely-obvious aspects to using the <dfn> element. we examine those here. specifying the term being defined the term being defined is identified following these rules: if the <dfn> element has a title attribute, the value of the title attribute is considered to be the term being defined. the element must still h...
... if the <dfn> element has a title attribute, the value of the title attribute is considered to be the term being defined. the element must still have text within it, but that text may be an abbreviation (perhaps using <abbr>) or another form of the term. if the <dfn> contains a single child element and does not have any text content of its own, and the child element is an <abbr> element with a title attribute itself, then the exact value of the <abbr> element's title is the term being defined. otherwise, the text content of the <dfn> element is the term being defined. this is shown in the first example below. if the <dfn> element has a title attribute, it must contain the term being defined and no other text. links to <dfn> elements if you include an id attribute on the <dfn> element, ...
...g the sky and returning data and photographs of unprecedented quality and detail.</p> <p>indeed, the <abbr title="hubble space telescope">hst</abbr> has arguably done more to advance science than any device ever built.</p> note the <abbr> element nested inside the <dfn>. the former establishes that the term is an abbreviation ("hst") and specifies the full term ("hubble space telescope") in its title attribute. the latter indicates that the abbreviated term represents a term being defined. result the output of the above code looks like this: specifications specification status comment html living standardthe definition of '<dfn>' in that specification. living standard html5the definition of '<dfn>' in that specification. recommendation ...

<input type="email"> - HTML: Hypertext Markup Language
ur guide on regular expressions; the 'u' flag is specified when compiling the regular expression, so that the pattern is treated as a sequence of unicode code points, instead of as ascii. no forward slashes should be specified around the pattern text. if the specified pattern is not specified or is invalid, no regular expression is applied and this attribute is ignored completely. tip: use the title attribute to specify text that most browsers will display as a tooltip to explain what the requirements are to match the pattern. you should also include other explanatory text nearby. see the section pattern validation for details and an example. placeholder the placeholder attribute is a string that provides a brief hint to the user as to what kind of information is expected in the field. it...
...r.com" (note the leading space) or "@@beststartupever.com", neither of which is valid. however, the browser runs both the standard e-mail address filter and our custom pattern against the specified text. as a result, we wind up with a validation which says "make sure this resembles a valid e-mail address, and if it is, make sure it's also a beststartupever.com address." it's advisable to use the title attribute along with pattern. if you do, the title must describe the pattern. that is, it should explain what format the data should take on, rather than any other information. that's because the title may be displayed or spoken as part of a validation error message. for example, the browser might present the message "the entered text doesn't match the required pattern." followed by your specified...
...e-mail address", which isn't very good. ...

<input type="url"> - HTML: Hypertext Markup Language
ur guide on regular expressions; the 'u' flag is specified when compiling the regular expression, so that the pattern is treated as a sequence of unicode code points, instead of as ascii. no forward slashes should be specified around the pattern text. if the specified pattern is not specified or is invalid, no regular expression is applied and this attribute is ignored completely. tip: use the title attribute to specify text that most browsers will display as a tooltip to explain what the requirements are to match the pattern. you should also include other explanatory text nearby. see the section pattern validation for details and an example. placeholder the placeholder attribute is a string that provides a brief hint to the user as to what kind of information is expected in the field. it...
...a dot, followed by "myco", followed by a dot, followed by any number of characters. and because the browser runs both the standard url filter and our custom pattern against the specified text, we wind up with a validation which says "make sure this is a valid url, and also in a myco domain." this isn't perfect, but it is good enough for this simple demo's requirements. it's advisable to use the title attribute along with pattern. if you do, the title must describe the pattern; it should explain what format the data should take on, rather than any other information. that's because the title may be displayed or spoken as part of a validation error message. for example, the browser might present the message "the entered text doesn't match the required pattern." followed by your specified title. i...
...url", which is not a good user experience. that's why, instead, we specify the string "the url must be in a myco domain". by doing that, the resulting full error message might be something like "the entered text doesn't match the required pattern. ...

HTML elements reference - HTML: Hypertext Markup Language
d icons for the home screen and apps on mobile devices) among other things. <meta> the html <meta> element represents metadata that cannot be represented by other html meta-related elements, like <base>, <link>, <script>, <style> or <title>. <style> the html <style> element contains style information for a document, or part of a document. <title> the html title element (<title>) defines the document's title that is shown in a browser's title bar or a page's tab. sectioning root element description <body> the html <body> element represents the content of an html document. there can be only one <body> element in a document. content sectioning content sectioning elements allow you to organize the document con...
...ord, line, or any arbitrary piece of text. element description <a> the html <a> element (or anchor element), with its href attribute, creates a hyperlink to web pages, files, email addresses, locations in the same page, or anything else a url can address. <abbr> the html abbreviation element (<abbr>) represents an abbreviation or acronym; the optional title attribute can provide an expansion or description for the abbreviation. <b> the html bring attention to element (<b>) is used to draw the reader's attention to the element's contents, which are not otherwise granted special importance. <bdi> the html bidirectional isolate element (<bdi>) tells the browser's bidirectional algorithm to treat the text it contains in isola...
...rectionality of text, so that the text within is rendered in a different direction. <br> the html <br> element produces a line break in text (carriage-return). it is useful for writing a poem or an address, where the division of lines is significant. <cite> the html citation element (<cite>) is used to describe a reference to a cited creative work, and must include the title of that work. <code> the html <code> element displays its contents styled in a fashion intended to indicate that the text is a short fragment of computer code. <data> the html <data> element links a given piece of content with a machine-readable translation. if the content is time- or date-related, the <time> element must be used. <dfn> the html definition...

Global attributes - HTML: Hypertext Markup Language
eyboard navigation, but its relative order is defined by the platform convention; a positive value means that the element should be focusable and reachable via sequential keyboard navigation; the order in which the elements are focused is the increasing value of the tabindex. if several elements share the same tabindex, their relative order follows their relative positions in the document. title contains a text representing advisory information related to the element it belongs to. such information can typically, but not necessarily, be presented to the user as a tooltip. translate an enumerated attribute that is used to specify whether an element's attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unch...
... recommendation snapshot of html living standard. from html5, contextmenu, draggable, dropzone, and spellcheck have been added. html5the definition of 'global attributes' in that specification. recommendation snapshot of html living standard. from html 4.01 specification, the concept of global attributes is introduced and the dir, lang, style, id, class, tabindex, accesskey, and title are now true global attributes. xml:lang which was initially part of xhtml, is now also part of html. hidden, data-*, contenteditable, and translate have been added. html 4.01 specification recommendation there are no global attributes defined. several attributes that will become global attributes in subsequent specifications are defined on a subset of elements. class an...
...s but <base>, <head>, <html>, <meta>, <script>, <style>, and <title>. lang is supported on all elements but <applet>, <base>, <basefont>, <br>, <frame>, <frameset>, <iframe>, <param>, and <script>. tabindex is only supported on <a>, <area>, <button>, <object>, <select>, and <textarea>. accesskey is only supported on <a>, <area>, <button>, <input>, <label>, <legend> and <textarea>. title is supported on all elements but <base>, <basefont>, <head>, <html>, <meta>, <param>, <script>, and <title>. ...

Reddit Example - Archive of obsolete content
the content script then needs to send the url to the add-on script. ...
...the content script then needs to send the url to the add-on script. ...

simple-prefs - Archive of obsolete content
ences must have. attribute description type the type of preference, as defined in the "preference types" section below. name an identifier for the preference. this is used to access the preference from your add-on: console.log(require("sdk/simple-prefs").prefs.mysettingname); this means that it must be a valid javascript identifier. title this is used as a label for the preference in the add-ons manager user interface. optional common attributes these are attributes that all preferences may have: attribute description description this appears below the preference title in the add-ons manager ui. value a default value for the preference. depending on the preference type, this...
...tring. it is used to label the button. in "package.json": { "type": "control", "label": "click me!", "name": "sayhello", "title": "say hello" } in "main.js": var sp = require("sdk/simple-prefs"); sp.on("sayhello", function() { console.log("hello"); }); localization using the sdk's localization system, you can provide translated forms of the title and description attributes. see the localization tutorial for more details. getting and setting preferences unless you've marked them as hidden, the user will be able to see and change the preferences in the add-on manager. you can also see them and change them programmatically using the prefs property, and listen for changes to a preference using on(). simple-prefs in the preferences system ...

tabs - Archive of obsolete content
rty. ondeactivate function a callback function that will be registered for the 'deactivate' event. this is an optional property. properties activetab the currently active tab in the active window. this property is read-only. to activate a tab object, call its activate method. example // get the active tab's title. var tabs = require("sdk/tabs"); console.log("title of active tab is " + tabs.activetab.title); length the number of open tabs across all windows. events open this event is emitted when a new tab is opened. this does not mean that the content has loaded, only that the browser tab itself is fully visible to the user. properties relating to the tab's content (for example: title, favicon, and url) will not be correct at this point. if you need t...
...t worker receives an error from content scripts. listeners are passed a single argument, error, which is the error posted from the content script and an object of type error. optional returns worker : the worker object can be used to communicate with the content script. see content scripts guide to learn the details. properties id the unique id for the tab. this property is read-only. title the title of the tab (usually the title of the page currently loaded in the tab) this property can be set to change the tab title. url the url of the page currently loaded in the tab. this property can be set to load a different url in the tab. favicon the url of the favicon for the page currently loaded in the tab. this property is read-only. this property is deprecated. from version 1.15, ...

Adding windows and dialogs - Archive of obsolete content
e window.alert function to open alert messages in our examples so far, but that's not the right way to do it. it's ok to use this function if you're just debugging some problem and want to see if the program reaches a specific line of code, or to inspect the value of a variable, but your final extension should not have alert calls anywhere. if you use window.alert, the alert window will have the title [javascript application], indicating that the source of the message is not well defined. the prompt service allows better alerts to be displayed. here's an example of displaying an alert using the prompt service: let prompts = cc["@mozilla.org/embedcomp/prompt-service;1"]. getservice(ci.nsipromptservice); prompts.alert(window, "alert title", "hello!"); you should of course use localiz...
...efined. the prompt service allows better alerts to be displayed. here's an example of displaying an alert using the prompt service: let prompts = cc["@mozilla.org/embedcomp/prompt-service;1"]. getservice(ci.nsipromptservice); prompts.alert(window, "alert title", "hello!"); you should of course use localized strings instead of hard-coded ones. the prompt service allows you to set the title of the dialog however you want it, and also lets you specify the window you want to use as a parent for the alert. this normally should be set to the current window. you can pass a null value and the service will pick the currently active window. confirm confirmation dialogs display a text with a yes / no question, and prompts the user to choose an answer. in html you can use the window.confirm ...

DOMSubtreeModified - Archive of obsolete content
example the following code will display the time of last dom change on the title bar of the page. this event has been deprecated in favor of the mutation observer api this event can cause infinite loops if you decide to change the dom inside the event handler, hence it has been disabled in a number of browsers (see domattrmodified and domsubtreemodified events are no longer fired when style attribute is changed via cssom for example). ...
...ation observer api this event can cause infinite loops if you decide to change the dom inside the event handler, hence it has been disabled in a number of browsers (see domattrmodified and domsubtreemodified events are no longer fired when style attribute is changed via cssom for example). document.body.addeventlistener('domsubtreemodified', function () { document.title = 'dom changed at ' + new date(); }, false); ...

Style System Overview - Archive of obsolete content
document source <doc> <title>a few quotes</title> <para class="emph"> franklin said that <quote>"a penny saved is a penny earned."</quote> </para> <para> fdr said <quote>"we have nothing to fear but <span class="emph">fear itself.</span>"</quote> </para> </doc> example document tree doc ↙ ↓ ↘ title para class="emph" para ↓ ↓ quote quote ↓ span class="emph" example stylesheet doc { display: block; text-indent: 1em; } title { display: block; font-size: 3em; } para { display: block; } [class="emph"] { font-style: italic; } css style rule representation each declaration ...
...ulewalker::forward on all the rules that are matched, we build or walk along the rule tree. the rule tree is a lexicographic tree of matched rules, where each node in the tree is represented by a nsrulenode. some style data is cached on nsrulenode objects to speed up computation and reduce memory use. ...

Property - Archive of obsolete content
ocale autocheck autofill autofillaftermatch boxobject browsers builder builderview buttons canadvance cangoback cangoforward canrewind checked checkstate child children classname clickselectsall clientheight clientwidth collapsed color columns command commandmanager completedefaultindex container contentdocument contentprincipal contenttitle contentview contentvieweredit contentviewerfile contentwindow contextmenu control controller controllers crop current currentindex currentitem currentnotification currentpage currentpane currentset currenturi customtoolbarcount database datasources date dateleadingzero datevalue decimalplaces decimalsymbol defaultbutton defaultvalue descripti...
...electeditems selectedpanel selectedtab selectionend selectionstart selstyle seltype sessioncount sessionhistory showcommentcolumn showpopup size smoothscroll spinbuttons src state statusbar statustext stringbundle strings style subject suppressonselect tabcontainer tabindex tabs tabscrolling tabpanels tag textlength textvalue timeout title toolbarname toolbarset tooltip tooltiptext top treeboxobject type uri useraction value valuenumber view webbrowserefind webnavigation webprogress width wizardpages wraparound year yearleadingzero related dom element properties dom:element.attributes dom:element.baseuri dom:element.childelementcount dom:element.childnodes dom:element.children do...

Filtering - Archive of obsolete content
namespace (not shown here), will be 'http://www.daml.org/2001/09/countries/country-ont#country'. the resulting rdf triples for the first country will be: http://www.daml.org/2001/09/countries/iso#it -> http://www.w3.org/1999/02/22-rdf-syntax-ns#type -> http://www.daml.org/2001/09/countries/country-ont#country http://www.daml.org/2001/09/countries/iso#it -> http://purl.org/dc/elements/1.1/title -> italy the type is just like any other triple in the datasource, so we don't need any special syntax to navigate over it. we just need to use the right predicate to look for all the countries. you might wonder what the ref attribute or starting point should be set to since there is no container for the countries. actually, we can just use the type as the starting point. <menulist datasources...
...s pointing into the type resource. since we want the arcs pointing into the type, we need to determine the source or subject of a triple. look at the resulting rdf triples above again if this is unclear. the starting node is 'http://www.daml.org/2001/09/countries/country-ont#country'. we need to iterate over the 'type' predicate to find the individual countries. a second triple is used to get the title for the country. <query> <content uri="?start"/> <triple subject="?country" predicate="http://www.w3.org/1999/02/22-rdf-syntax-ns#type" object="?start"/> <triple subject="?country" predicate="http://purl.org/dc/elements/1.1/title" object="?countrytitle"/> </query> the action body will need to generate a <menuitem> for each result. it will also need t...

Sorting Results - Archive of obsolete content
er that the template builder generates the results. for ascending or descending sorts, this doesn't matter, since it will ignore whether results are containers and just sort by a value, alphabetically or numerically depending on the type of data. when using a tree, sorting may be performed on each column of the tree. for instance, if a list of photos was displayed in a two column tree showing the title and description, you could sort by either title or description. the user can change the sort column and direction by clicking the column headers, however, you can programmatically change the sort as well. sorting tree results we'll examine sorting of trees first since trees are the most common element used with sorted items. using a tree builder, you can sort the results in a tree by a column. to ...
...the arguments to the sort method specify the root node (the listbox), the sort key and the sort direction. « previousnext » ...

Creating a Wizard - Archive of obsolete content
using the wizardpage element. you can place whatever content you want inside each wizardpage. note that wizards currently only work properly from chrome urls. the wizard consists of several sections. the exact layout will vary according to the os for the platform. wizards will generally be displayed using customs that are familiar to the user of a particular os. a typical layout will include a title across the top, a set of navigation buttons across the bottom and the page contents in between. the title across the top is created using the title attribute, much like one would use for regular windows. the navigation buttons are created automatically. an example wizard source <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <wizard id="example-window" t...
..."/> <radio value="large" label="large"/> </radiogroup> <radiogroup> <caption label="gender"/> <radio value="male" label="male"/> <radio value="female" label="female"/> </radiogroup> </wizardpage> </wizard> this wizard has two pages, one that has a drop-down menu and the other with a set of radio buttons. the wizard will be formatted automatically, with a title across the top and a set of buttons along the bottom. the user can navigate between the pages of the wizard with the back and next buttons. these buttons will enable and disable themselves at the appropriate moments. in addition, on the last page, the finish button will appear. all of this is automatic, so you don't have to do anything to manipulate the pages. the description attribute may option...

Open and Save Dialogs - Archive of obsolete content
components.interfaces.nsifilepicker; var fp = components.classes["@mozilla.org/filepicker;1"].createinstance(nsifilepicker); fp.init(window, "select a file", nsifilepicker.modeopen); first, a new file picker object is created and stored in the variable 'fp'. the 'init' function is used to initialize the file picker. this function takes three arguments, the window that is opening the dialog, the title of the dialog and the mode. the mode here is modeopen which is used for an open dialog. you can also use modegetfolder and modesave for the other two modes. these modes are constants of the nsifilepicker interface. default directory and filters there are two features you can set of the dialog before it is displayed. the first is the default directory that is displayed when the dialog is opene...
...t files only or all files. you can also use filterxml and filterxul to filter for xml and xul files respectively. if you would like to filter for custom files, you can use the appendfilter() function to do this: fp.appendfilter("all files" ,"*.*"); fp.appendfilter("audio files (*.wav, *.mp3)","*.wav; *.mp3"); this line will add a filter for wave and mp3 audio files. the first argument is the title of the file type and the second is a semicolon-seperated list of file masks. you can add more masks or fewer masks as needed. you can call appendfilter as many times as necessary to add additional filters. the order you add them determines their priority. typically, the first one added is selected by default. getting the selected file finally, you can show the dialog by calling the show() functi...

XBL Attribute Inheritance - Archive of obsolete content
skin/example.xml#labeledtextbox'); } xbl: <binding id="labeledtextbox"> <content> <xul:label xbl:inherits="value=title"/> <xul:textbox xbl:inherits="value"/> </content> </binding> the textbox inherits the value attribute directly. to set the value attribute on the label, we need to use a different attribute name and map it to the value. the inherits attribute on the label grabs the title attribute from the labeledtextbox and maps it to the value attribute of the label element. the syntax <inner attribute>=<outer attribute> is used to map one attribute to another. here is another example: xul: <box class="okcancel" oktitle="ok" canceltitle="cancel" image="happy.png"/> css: box.okcancel { -moz-binding: url('chrome://example/skin/example.xml#okcancel'); } xbl: <binding id="o...
...another. here is another example: xul: <box class="okcancel" oktitle="ok" canceltitle="cancel" image="happy.png"/> css: box.okcancel { -moz-binding: url('chrome://example/skin/example.xml#okcancel'); } xbl: <binding id="okcancel"> <content> <xul:button xbl:inherits="label=oktitle,image"/> <xul:button xbl:inherits="label=canceltitle"/> </content> </binding> the value of the oktitle attribute is mapped to the label attribute of the first button. the canceltitle attribute is mapped to the label attribute of the second button. the first button also inherits the image attribute. the result is as follows: <box class="okcancel" oktitle="ok" canceltitle="cancel" image="happy.png"> <button label="ok" image="happy.png"/> <button label="cancel"/> </box> note that the attributes a...

XUL accessibility guidelines - Archive of obsolete content
ended to use both a text label in the label attribute and image alt text in the tooltiptext attribute. view the code examples below. <image src="stop.png" tooltiptext="stop" /> <html:img src="stop.jpg" alt="stop" /> <html:img src="decorative_image.jpg" alt="" /> <!-- in html the alt attribute is required. --> <toolbarbutton label="stop" image="stop.png" tooltiptext="stop loading the page" /> title provide unique titles to window container elements such as windows, wizards, and dialogs. titles provide users the most basic information about the application. the title is often the first thing spoken by a screen reader when an application is opened or activated. users can also refer back to the title to get a sense of where they are located. titles are displayed in the top bar of an applicatio...
...th a keyboard. focus keyboard focus is maintained and does not move unexpectedly. focus moves or is disabled unexpectedly. assistive information checkpoint pass fail alternative text alternative text is provided for meaningful images. alternative text is missing on meaningful images, or it is inappropriate for the function of an image. title all windows, including dialogs and wizards, have a descriptive title. windows lack a title or have a incorrect title. form labels every form element has an associated label and radiobuttons are encapsulated in a groupbox. form elements are missing labels or the labels are not programmatically connected or radiobuttons are not contained in a groupbox. display c...

dialog - Archive of obsolete content
ogs and prompts (code snippets). ...
...lly, this means that the button will be activated when the enter key is pressed. this should be set to one of the same values as those for the buttons attribute. inactivetitlebarcolor type: color string specify background color of the window's titlebar when it is inactive (background). moreover this hides separator between titlebar and window contents. this affects only on mac os x. title type: string the text to appear in the title bar of the window. properties buttons type: comma-separated list of the values below a comma-separated list of buttons to appear on the dialog box. the buttons will be placed in suitable locations for the user's platform and basic event handling will be performed automatically. the following values can be used in the list: accept: the ok ...

wizard - Archive of obsolete content
indow's titlebar when it is inactive (background). moreover this hides separator between titlebar and window contents. this affects only on mac os x. lastpage type: boolean true if the wizard is on the last page. use the cancancel property to indicate to the user (by disabling the cancel button) that they cannot can pagestep type: integer the index of the current page. title type: string the text to appear in the title bar of the window. windowtype type: string set to a string which can be used to identify the type of window. this might be used, for example, to distinguish between a browser window and an editor window. some of mozilla's window handling functions use this attribute to group windows of the same type together. values for window type as found...
...urrently selected page. you can change the selected page by modifying this property. pagestep type: integer this property returns the number of pages that the user has navigated through so far, meaning that the user would press the back button this many times to go back to the beginning. this property is different than pageindex, because pages are not necessarily navigated in order. title type: string the title that appears at the top of the wizard. this is overridden by the label attribute on the individual pages. wizardpages type: dom nodelist of wizardpage elements this property holds the list of wizardpage elements in the wizard. methods inherited methods addeventlistener(), appendchild(), blur, click, clonenode(), comparedocumentposition, d...

XULRunner tips - Archive of obsolete content
utton to save space. this button is usually called "xulrunner.exe" and has xulrunner's icon. there are two approaches to display the branding of your application instead: when compiling xulrunner yourself: create a file module.ver in the directory mozilla/xulrunner/app with the contents: win32_module_description=myapplication myapplication should be replaced by whatever you want to see as title of the button. you can also replace xulrunner.ico in the same directory to change xulrunner's icon to the icon of your application. with a precompiled xulrunner: use xulrunner-stub.exe to start your application but rename it into myapplication.exe. with xulrunner 1.9 this will make the desired name appear in the task bar (not with xulrunner 1.8 however). your application's icon can also be adde...
...ch to run a specified xul application instead of starting the browser. on windows: firefox.exe -app path\to\application.ini on linux: firefox -app path/to/application.ini on the mac: /applications/firefox.app/contents/macos/firefox-bin -app /path/to/application.ini note that at least on the mac, you need to use a full path. partial paths don't seem to work. troubleshooting window title missing if the title of your xul <window> is blank, even though you specified a title attribute, make sure the extension on your xul file is .xul rather than .xml default theme to create a default theme you need to create a folder in the extensions folder with an install.rdf in it. as of oct. 2008, the folder needs to have the same name as the one in firefox 3.0. \myapp\extensions{972ce4c6-7...

Theme changes in Firefox 2 - Archive of obsolete content
#application #feedbody #feedchangesubscribeoptions #feederror #feedheader #feedheader[firstrun="true"] #feedheader[firstrun="true"] #feedintrotext #feedheader[firstrun="true"] #feedsubscribeline #feedintrotext #feedsubscribedonechangingoptions #feedsubscribehandletext #feedsubscribehandler #feedsubscribeline #feedsubscribeoptions #feedsubscribeoptionsgroup #feedsubscribeoptionsgrouptitle #feedtitlecontainer #feedtitleimage #feedtitlelink #readercontainer #readergroup #readers #readers > listitem .feedentrycontent .feedsubscribebutton .feedsubscribebutton .button-icon .feedsubscribelink .feedsubscribelinkbox .field .link .link:hover:active .plain .plain > .button-box .plain:focus > .button-box .stylelessborderless the default theme also includes styles for a[hr...
...barbutton-text toolbar[mode="text"] .toolbarbutton-icon you may wish to change other styles as well. changes in mozapps extensions/about.css the following styles from firefox 1.5 are no longer used in firefox 2 and should be removed: #contributorsbox #creatorbox #extensioncontributors #extensioncontributors #extensioncreatorlabel the following styles were added: .indent .sectiontitle you may wish to make changes to other styles as well. extensions/update.css the following styles are no longer used in firefox 2 and should be removed from your theme: #foundlist #statusbar-updates .updatecategorybox .updatecategorycontent .updatecategoryicon .updatecategorylabel[selected="true"] .updateicon .updateicon[severity="0"] .updateicon[severity="1"] .updateicon[severity="...

Reference - Archive of obsolete content
in_javascript_1.7#using_javascript_1.7. this will impact the presentation of future examples if it hasn't already. --george3 11:47, 14 sept 2006 (edt) sgml comment hiding quirks sgml comment hiding needs to be mentioned here and its consequences. ...
...thanks :) -- dria deprecated pre box is there any wiki markup available for deprecated examples? --maian 20:24, 25 aug 2005 (pdt) help:custom_templates#template:deprecated_header --nickolay 00:58, 26 aug 2005 (pdt) hmm, that was a bad question. what i meant to ask is: what markup should i use for bad examples (which aren't necessarily deprecated), i.e. ...

Test your skills: HTML accessibility - Learn web development
for this task to work in your own editor or in an online editor. html accessibility 2 in the second task, you have a form containing three input fields. you need to: semantically associate the input with their labels. assume that these inputs will be part of a larger form, and wrap them in an element that associates them all together as a single related group. give the group a description/title that summarises all of the information as personal data. try updating the live code below to recreate the finished example: download the starting point for this task to work in your own editor or in an online editor. html accessibility 3 in this task you are required to turn all the information links in the paragraph into good, accessible links. the first two links just go to regular w...
... you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for html accessibility 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone wit...

Test your skills: Selectors - Learn web development
ist items that are a direct child of the ul with a class of list. try updating the live code below to recreate the finished example: for assessment or further work purposes, download the starting point for this task to work in your own editor or in an online editor. selectors five in this final task add css using attribute selectors to do the following: target the <a> element with a title attribute and make the border pink (border-color: pink). target the <a> element with an href attribute that contains the word contact somewhere in its value and make the border orange (border-color: orange). target the <a> element with an href value starting with https and give it a green border (border-color: green). try updating the live code below to recreate the finished example: for...
... you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for selectors skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a...

Using your new knowledge - Learn web development
live example shows a biography, which has been styled using css. the css properties that i have used are as follows — each one links to its property page on mdn, which will give you more examples of its use. font-family color border-bottom font-weight font-size text-decoration i have used a mixture of selectors, styling elements such as h1 and h2, but also creating a class for the job title and styling that. use css to change how this biography looks by changing the values of the properties i have used. make the level one heading pink, using the css color keyword hotpink. give the heading a 10px dotted border-bottom which uses the css color keyword purple. make the level 2 heading italic. give the ul used for the contact details a background-color of #eeeeee, and a 5px solid p...
...his stage in your learning you can afford to have a bit of fun. assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for css first steps". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding probl...

JavaScript basics - Learn web development
c value is equal to the path of the original image: if it is, the code changes the src value to the path of the second image, forcing the other image to be loaded inside the <img> element. if it isn't (meaning it must already have changed), the src value swaps back to the original image path, to the original state. adding a personalized welcome message next, let's change the page title to a personalized welcome message when the user first visits the site. this welcome message will persist. should the user leave the site and return later, we will save the message using the web storage api. we will also include an option to change the user, and therefore, the welcome message. in index.html, add the following line just before the <script> element: <button>change user</button>...
...tusername(). put this onclick event handler (below) on the button. when clicked, setusername() runs. this allows the user to enter a different name by pressing the button. mybutton.onclick = function() { setusername(); } a user name of null? when you run the example and get the dialog box that prompts you to enter your user name, try pressing the cancel button. you should end up with a title that reads mozilla is cool, null. this happens because—when you cancel the prompt—the value is set as null. null is a special value in javascript that refers to the absence of a value. also, try clicking ok without entering a name. you should end up with a title that reads mozilla is cool, for fairly obvious reasons. to avoid these problems, you could check that the user hasn't entered a bla...

What will your website look like? - Learn web development
at should your website actually do? a website can do basically anything, but, for your first try, you should keep things simple. we'll start by creating a simple webpage with a heading, an image, and a few paragraphs. to begin, you'll need to answer these questions: what is your website about? do you like dogs, new york, or pac-man? what information are you presenting on the subject? write a title and a few paragraphs and think of an image you'd like to show on your page. what does your website look like, in simple high-level terms? what's the background color? what kind of font is appropriate: formal, cartoony, bold and loud, subtle? note: complex projects need detailed guidelines that go into all the details of colors, fonts, spacing between items on a page, appropriate writing style,...
...ner and a user experience (ux) designer. graphic designers put together the visuals of the website. ux designers have a somewhat more abstract role in addressing how users will experience and interact with the website. choosing your assets at this point, it's good to start putting together the content that will eventually appear on your webpage. text you should still have your paragraphs and title from earlier. keep these close by. theme color to choose a color, go to the color picker and find a color you like. when you click on a color, you'll see a strange six-character code like #660066. that's called a hex code (short for hexadecimal), and represents your color. copy the code down somewhere safe for now. images to choose an image, go to google images and search for something suita...

Structuring a page of content - Learn web development
. note: if you get stuck, then ask us for help — see the assessment or further help section at the bottom of this page. project brief for this project, your task is to take the content for the homepage of a bird watching website and add structural elements to it so it can have a page layout applied to it. it needs to have: a header spanning the full width of the site containing the main title for the page, the site logo, and the navigation menu. the title and logo appear side by side once styling is applied, and the navigation appears below those two items. a main content area containing two columns — a main block to contain the welcome text, and a sidebar to contain image thumbnails. a footer containing copyright information and credits. you need to add a suitable wrapper for: ...
...mple of what the homepage might look like after being marked up. assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for structuring a page of content". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with ...

What’s in the head? Metadata in HTML - Learn web development
er pages however, the head can get quite full. try going to some of your favorite websites and use the developer tools to check out their head contents. our aim here is not to show you how to use everything that can possibly be put in the head, but rather to teach you how to use the major elements that you'll want to include in the head, and give you some familiarity. let's get started. adding a title we've already seen the <title> element in action — this can be used to add a title to the document. this however can get confused with the <h1> element, which is used to add a top level heading to your body content — this is also sometimes referred to as the page title. but they are different things! the <h1> element appears on the page when loaded in the browser — generally this should ...
...t in action — this can be used to add a title to the document. this however can get confused with the <h1> element, which is used to add a top level heading to your body content — this is also sometimes referred to as the page title. but they are different things! the <h1> element appears on the page when loaded in the browser — generally this should be used once per page, to mark up the title of your page content (the story title, or news headline, or whatever is appropriate to your usage.) the <title> element is metadata that represents the title of the overall html document (not the document's content.) active learning: inspecting a simple example to start off this active learning, we'd like you to go to our github repo and download a copy of our title-example.html page. to do ...

Test your skills: Multimedia and embedding - Learn web development
formats the sources point to, so it can make an informed choice of which one to download ahead of time. give the <video> a width and height equal to its intrinsic size (320 by 240 pixels). make the video muted by default. display the text tracks contained in the media folder, in a file called subtitles_en.vtt, when the video is playing. you must explicitly set the type as subtitles, and the subtitle language to english. try updating the live code below to recreate the finished example: download the starting point for this task to work in your own editor or in an online editor. multimedia and embedding 3 for this final task you have two tasks to do: embed a pdf into the page. the pdf is called mypdf.pdf, and is contained in the media folder. go to a sharing site like youtube or go...
... you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for html image basics 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with...

Test your skills: Object basics - Learn web development
aining the following members: name: a string representing the name of the album. released: a number representing the year the album was released. include at least two albums in the albums array. once you've done this, you should then write a string to the variable bandinfo, which will contain a small biography detailing their name, nationality, years active, and style, and the title and release date of their first album. try updating the live code below to recreate the finished example: download the starting point for this task to work in your own editor or in an online editor. object basics 3 finally for our object basics assessment, we want you to return to the cat object literal from task #1. we want you to rewrite the greeting() method so that it logs "hello, said...
... you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for object basics 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a c...

Accessibility API cross-reference
order and old information may disappear. log the main content of a document, distinct from complementary info, headers, footers, navigation, asides etc. main <main> a type of live region where non-essential information changes frequently. marquee the main menu bar below the app's title bar menubar menu_bar menu_bar menubar a menu item menuitem menu_item menu_item menuitem a menuitem with a checkable state whose possible values are true, false, or mixed. menuitemcheckbox a checkable menuitem in a set of elements with the same role, only one of which can be checked at ...
... tabpanel a word or phrase with a corresponding definition. ...

Creating localizable web applications
snippet 8. good: <p class="description"><strong><?= _("description:");?></strong></p> snippet 9. good: <h1> <?printf("<a href=\"%s\"><img src=\"/static/img/logo.png\" alt=\"" . _("mozilla labs personas") . "\" /></a>", $locale_conf->url('/'));?> </h1> snippet 10. better: <h1> <a href="<?= $locale_conf->url('/') ?>"> <img src="/static/img/logo.png" alt="<?= /* l10n: link title attribute */ _("mozilla labs personas"); ?> " /> </a> </h1> ...but don't sacrifice flexibility don't sacrifice flexibility trying to satisfy the rule above. make sure the content supports changing the order of the sentence, which may be required by some grammars. snippet 1. bad: <p class="added"><?= _("<strong>added:</strong>") . $persona['date']; ?></p> snippet 2. bad: <p class="added"><s...
...ments starting with this prefix using the --add-comments=prefix option, for example xgettext --add-comments=l10n. snippet 1. bad: <h1> <a href="<?= $locale_conf->url('/') ?>"> <img src="/static/img/logo.png" alt="<?= _("mozilla labs personas"); ?>" /> </a> </h1> snippet 2. good: <h1> <a href="<?= $locale_conf->url('/') ?>"> <img src="/static/img/logo.png" alt="<?= /* l10n: link title attribute */ _("mozilla labs personas") ?> " /> </a> </h1> snippet 3. bad: <p class="added"><? printf(_("<strong>added:</strong> %s"), $persona['date']);?></p> snippet 4. good: <p class="added"><? printf( /* l10n: %s is a date */ _("<strong>added:</strong> %s"), $persona['date']);?></p> snippet 5. bad: printf(_("%1$s by %2$s"), $persona['name'], $persona['display_username']); snippe...

Extras
echnology demonstration of some of the extras in mozilla but not defined in the mathml spec, and not prevented by the spec either. they are not portable and are meant to showcase a few interesting upshots from building natively upon the browser environment. other renderers are expected to ignore attributes that they don't understand while the behavior of undefined elements is well, undefined. ...
...the spec either. they are not portable and are meant to showcase a few interesting upshots from building natively upon the browser environment. other renderers are expected to ignore attributes that they don't understand while the behavior of undefined elements is well, undefined. ...

Mozilla Web Developer FAQ
useful for people who don’t see the image.) when the alternative text is shown in a tooltip, other authors don’t want to supply textual alternatives at all, because they don’t want tooltips to appear. (again, making things harder for people who don’t see the image.) there is another attribute that mozilla shows as a tooltip: title. ...
...tual alternatives at all, because they don’t want tooltips to appear. (again, making things harder for people who don’t see the image.) there is another attribute that mozilla shows as a tooltip: title. in fact, the html 4.01 specification suggests that the title attribute may be displayed as a tooltip. however, this particular display method is not required and some other browsers show the title attribute in the browser status bar, for example. at this point some people feel compelled to post a “but ie…” rant in the newsgroups or in bugzilla. please note that mac ie 5 behaves in the same way as mozilla when it comes to the alt and title attributes. windows ie also shows the title attribute in a tooltip. does mozilla support downloadable fonts? downloadable fonts in truetype and o...

Places utilities for JavaScript
ws the "add bookmark" dialog. showaddbookmarkui(auri, atitle, adescription, adefaultinsertionpoint, ashowpicker, aloadinsidebar, akeyword, apostdata) parameters [optional] auri an nsiuri object for which the "add bookmark" dialog is to be shown. [optional] atitle the default title for the new bookmark. [optional] adescription the default description for the new bookmark [optional] adefaultinsertionpoint the default insertion point for the new item. if set, the folder picker would be hidden unless ashowpicker is set to true, in which case the dialog only uses the folder identifier from the insertion point as the initially selected item in the folder pi...
...pens the folder properties panel for a given folder id. showfolderproperties(aid) parameters aid an integer representing the id of the folder to edit return type return true if any transaction has been performed. showaddfolderui() shows the "new folder" dialog. showaddfolderui(atitle, adefaultinsertionpoint, ashowpicker) parameters [optional] atitle the default title for the new bookmark. [optional] adefaultinsertionpoint the default insertion point for the new item. if set, the folder picker would be hidden unless ashowpicker is set to true, in which case the dialog only uses the folder identifier from the insertion point as the initially selected item in the folder picker. [optional] ashowpicker see above return type return true if ...

Querying Places
de.result_type_full_visit: var fullvisit = node.queryinterface(ci.nsinavhistoryfullvisitresultnode); dump("full visit result " + node.uri + " session = " + fullvisit.sessionid + " transitiontype = " + fullvisit.transitiontype + "\n"); break; case node.result_type_host: var container = node.queryinterface(ci.nsinavhistorycontainerresultnode); dump("host " + container.title + "\n"); break; case node.result_type_remote_container: var container = node.queryinterface(ci.nsinavhistorycontainerresultnode); dump("remote container " + container.title + " type = " + container.remotecontainertype + "\n"); break; case node.result_type_query: var query = node.queryinterface(ci.nsinavhistoryqueryresultnode); dump("query, place uri = " + query.uri + "\...
...ype_query: var query = node.queryinterface(ci.nsinavhistoryqueryresultnode); dump("query, place uri = " + query.uri + "\n"); break; case node.result_type_folder: // note that folder nodes are of type nsinavhistorycontainerresultnode by default, but // can be qi'd to nsinavhistoryqueryresultnode to access the query and options that // created it. dump("folder " + node.title + " id = " + node.itemid + "\n"); break; case node.result_type_separator: dump("-----------\n"); break; } the result view interface if you are mapping a result into ui, you can implement the nsinavhistoryresultviewer interface and attach it to the result with the nsinavhistoryresult.viewer attribute. this viewer will be called when the result tree changes, either as a result of us...

Retrieving part of the bookmarks tree
to close the container to free up the resources. otherwise, it will continue to get observer notifications and update itself, slowing down the whole browser. var rootnode = result.root; rootnode.containeropen = true; // iterate over the immediate children of this folder and dump to console for (var i = 0; i < rootnode.childcount; i ++) { var node = rootnode.getchild(i); dump("child: " + node.title + "\n"); } // close a container after using it! rootnode.containeropen = false; if you encounter a node with a type of result_type_folder or another type of container, you can open these folders and descend into the hierarchy. you will want to read the section "using the results" in places:query system to understand the different result types. complete code listing var historyservice = component...
...rootnode.containeropen = false; ...

mozIAsyncHistory
h to retrieve information, identified by either a single place guid, a single uri, or a js array of uris and/or guids. acallback an object implementing the mozivisitedstatuscallback.isvisited() method; this method will be called with the results once the request has been completed. updateplaces() adds a set of visits for one or more moziplaceinfo objects, and updates each moziplaceinfo's title or guid. note that this lets you add to history even in private browsing mode; if that's not desired you can first check whether the window is in private browsing mode. void updateplaces( in moziplaceinfo aplaceinfo, in mozivisitinfocallback acallback optional ); parameters aplaceinfo the moziplaceinfo object[s] containing the information to store or update. this can be a single obj...
...er the window is in private browsing mode. void updateplaces( in moziplaceinfo aplaceinfo, in mozivisitinfocallback acallback optional ); parameters aplaceinfo the moziplaceinfo object[s] containing the information to store or update. this can be a single object, or an array of objects. acallback optional a mozivisitinfocallback object to be notified for each visit addition, title change, guid change, or error. if more than one operation is performed for a given visit, only one callback will be given (i.e. title change and add visit). exceptions thrown ns_error_invalid_arg passing in null for aplaceinfo. not providing at least one valid guid or uri for all moziplaceinfo object[s]. not providing an array or nothing for the visits property of moziplaceinfo...

mozIVisitInfoCallback
einfo aplaceinfo);obsolete since gecko 8.0 methods handleerror() called when a moziplaceinfo couldn't be processed. void handleerror( in nsresult aresultcode, in moziplaceinfo aplaceinfo ); parameters aresultcode nsresult indicating the reason why the change failed. aplaceinfo the information that was unable to be processed. handleresult() called for each visit added, title change, or guid change when passed to moziasynchistory.updateplaces(). if more than one operation is done for a given visit, this method is only called once (for all changes at once). void handleresult( in moziplaceinfo aplaceinfo ); parameters aplaceinfo the information that was entered into the database. oncomplete() obsolete since gecko 8.0 (firefox 8.0 / thunderb...
...aces(). if more than one operation is done for a given visit, this method is only called once (for all changes at once). void handleresult( in moziplaceinfo aplaceinfo ); parameters aplaceinfo the information that was entered into the database. oncomplete() obsolete since gecko 8.0 (firefox 8.0 / thunderbird 8.0 / seamonkey 2.5) called for each visit added, title change, or guid change when passed to moziasynchistory.updateplaces(). void oncomplete( in nsresult aresultcode, in moziplaceinfo aplaceinfo ); parameters aresultcode nsresult of the change indicating success or failure reason. aplaceinfo the information that was being entered into the database. notes this method was replaced by the separate handleresult() and handleerror() ...

nsIBrowserHistory
ved in gecko 15.0. you should use moziasynchistory.updateplaces() instead. this method adds a page to the history with specific time stamp information. it is called by history importing code and is used in the history migration tool. void addpagewithdetails( in nsiuri auri, in wstring atitle, in long long alastvisited ); parameters auri the page that will be added to the history. atitle the title of the page. alastvisited when the page was last visited, in microseconds since the unix epoch. markpageasfollowedlink() obsolete since gecko 22.0 (firefox 22.0 / thunderbird 22.0 / seamonkey 2.19) note: this method was moved to another interface in gecko 22.0. you should use nsinavhistoryservice.markpageasfollowedlink() instead. this function was origina...
...iven domain. if aentiredomain is true, it will assume ahost is a domain, and remove all pages from the entire domain. void removepagesfromhost( in autf8string ahost, in boolean aentiredomain ); parameters ahost the name of the host to be removed. an empty value for this parameter means local files and anything else without a hostname. you can also pass in the localized "(local files)" title given to you by a history query to remove all history information for local files. aentiredomain if set to true, it will assume ahost is a domain, and remove all pages from the entire domain, including subdomains. set to false otherwise. removevisitsbytimeframe() removes all visits within the given timeframe, using a batch. any pages that become unvisited as a result are also deleted. void r...

nsIFilePicker
mpeg, *.mpg, *.ogm, *.ogv, *.ogx, *.rm, *.rmvb, *.smil, *.webm, *.wmv and *.xvid filters for file extensions. methods appendfilter() appends a custom file extension filter to the dialog. the filter appended first will be used to display the nsifilepicker dialog, the user may then select another from the list. void appendfilter( in astring title, in astring filter ); parameters title the title of the filter. filter the filter string. multiple extensions may be included, separated by a semicolon and a space. example some example filter strings: "*.ics" "*.txt; *.doc; *.rtf" appendfilters() appends a list of file extension filters, from the predefined list, to the dialog. void appendfilters( in long filtermask ); parameters note: if appendfilters is the first ...
...of the filters you wish to use. you may or multiple filters together; for example filterall | filterhtml. init() initialize the file picker widget. the file picker is not valid until this method is called. void init( in nsidomwindow parent, in astring title, in short mode ); parameters parent the nsidomwindow parent. this dialog will be dependent on this parent. must be non-null. title the file picker dialog title. if this is null, the dialog will have the default title. mode one of the mode constants, indicating the type of picker to create. open() opens the file dialog asynchrounously. the passed in object's done method will be called upon completion. void open( in nsifilepickershowncallback afilepickershowncallback ); parameters afilepickershowncallback the nsi...

nsIJumpListBuilder
dtorecentdocs shell api. jumplist_category_frequent 2 frequent lists are based on window's recent document lists. the lists are generated automatically by windows. applications that use recent or frequent lists should keep document use tracking up to date by calling the shaddtorecentdocs shell api. jumplist_category_customlist 3 custom lists can be made up of tasks, links, and separators. the title of of the list is passed through the optional string parameter of addbuildlist. methods abortlistbuild() aborts and clears the current jump list build. void abortlistbuild(); parameters none. addlisttobuild() adds a list and if required, a set of items for the list. boolean addlisttobuild( in short acattype, in nsiarray items, optional in astring catname optional ); parameters acattype...
...ent jump list build. void abortlistbuild(); parameters none. addlisttobuild() adds a list and if required, a set of items for the list. boolean addlisttobuild( in short acattype, in nsiarray items, optional in astring catname optional ); parameters acattype the type of list to add. items optional an array of nsijumplistitem items to add to the list. catname optional for custom lists, the title of the list. return value true if the operation completed successfully. exceptions thrown ns_error_unexpected on internal errors. ns_error_illegal_value if an item is added that was removed since the last commit. ns_error_invalid_arg if incorrect parameters are passed for a particular category or item type. commitlistbuild() commits the current jump list build to the taskbar. boolean commitlist...

nsINavBookmarkObserver
rameters aitemid the id of the item that was added. aparentid the id of the folder to which the item was added. aindex the item's index in the folder. aitemtype the type of the item that was added. this should be one of the nsinavbookmarksservice.type constants. auri the uri of the item that was added when aitemtype is type_bookmark, null otherwise. atitle the title of the added item. adateadded the stored date added value, in microseconds from the epoch. aguid the unique id associated with the item. aparentguid the unique id associated with the item's parent. onitemchanged() this method notifies this observer that an item's information has changed. it is called whenever any attributes like "title" are changed. void ...
... aguid the unique id associated with the item. aparentguid the unique id associated with the item's parent. notes this table indicates what anewvalue should be depending on property specified by aproperty: property string value "cleartime" empty string; this property means the history was deleted, so there's no last visit date. "title" the new title for the item "favicon" the "moz-anno" url for the new favicon image. "uri" the new uri for the item. "tags" empty string; this property indicates that the set of tags for the item have changed. "dateadded" the prtime at which the item was first added to the database. "lastmodified" the prtime at which the item was last modified. oni...

nsINavHistoryResultObserver
iner( in nsinavhistorycontainerresultnode acontainernode ); parameters acontainernode the container that should be rebuilt. nodeannotationchanged() called right after the annotation on a node has changed. this is called when the annotation is changed, set, or unset. void nodeannotationchanged( in nsinavhistoryresultnode anode, in autf8string aannoname ); parameters anode the node whose title has changed. aannoname the name of the annotation that changed. nodedateaddedchanged() called right after the dateadded property property of a node has changed. void nodedateaddedchanged( in nsinavhistoryresultnode anode, in prtime anewvalue ); parameters anode the node whose dateadded property has changed. anewvalue the new value of the dateadded property. nodehistorydetailschanged() call...
...item is being replaced. aoldnode the node which is being replaced. anewnode the node replacing the aoldnode. aindex the index at which the node is located in the container. nodetagschanged() called right after a node's tags have changed. void nodetagschanged( in nsinavhistoryresultnode anode ); parameters anode the node whose tags have changed. nodetitlechanged() called right after a node's title has changed. void nodetitlechanged( in nsinavhistoryresultnode anode, in autf8string anewtitle ); parameters anode the node whose title has changed. anewtitle the new title of the node. nodeurichanged() called right after the uri of a node has changed. void nodeurichanged( in nsinavhistoryresultnode anode, in autf8string anewuri ); parameters anode the node whose uri has changed. anew...

nsISHEntry
ntry clone(); parameters none. return value native code only!create additional ways to create an entry. void create( in nsiuri uri, in astring title, in nsiinputstream inputstream, in nsilayouthistorystate layouthistorystate, in nsisupports cachekey, in acstring contenttype, in nsisupports owner, in unsigned long long docshellid, in boolean dynamiccreation ); parameters uri title inputstream layouthistorystate cachekey contenttype owner docshellid dynamiccreation violates the xpcom interface guidelines forgeteditordata() gets the owning pointer to the editor data assosicated with this shistory entry. this forgets its pointer, so free it when you're done. nsdocshelleditordataptr forgeteditordata(); parameters none. return value getanycontentviewer() ret...
...a when it is destroyed. void seteditordata( in nsdocshelleditordataptr adata ); parameters adata setissubframe() attribute that indicates if this entry is for a subframe navigation. void setissubframe( in boolean aflag ); parameters aflag setscrollposition() set/get scrollers' positon in anchored pages. void setscrollposition( in long x, in long y ); parameters x y settitle() title for the document. void settitle( in astring atitle ); parameters atitle setuniquedocidentifier() changes this entry's doc identifier to a new value which is unique among those of all other entries. void setuniquedocidentifier(); parameters none. seturi() uri for the document. void seturi( in nsiuri auri ); parameters auri native code only!setviewerbounds void setviewerbounds( in ns...

nsITXTToHTMLConv
...
...d the methods using the initialcaps style instead of the intercaps style. methods preformathtml() specifies whether or not to wrap the resulting html in an <pre> block. void preformathtml( in boolean value ); parameters value true to wrap the resulting html in a <pre> block. settitle() sets the title to use on the resulting html document. void settitle( in wstring text ); parameters text title to set for the html document. ...

nsITransferable
flect the status of the context in which the transferable was created. native code only! requestingnode nsidomnode the source dom node this transferable was created from. native code only! note: currently, this can only be used on windows (in order to support network principal information in drag operations). constants kflavorhasdataprovider (that title needs to be better) constant value description kflavorhasdataprovider 0 a description is needed here. common mime types some of these need better descriptions, especially the mozilla-specific ones. constant value description ktextmime text/plain plain text. kunicodemime text/unicode unicode text. kmoz...
...me image/png png image. kjpegimagemime image/jpeg jpeg image. kjpgimagemime image/jpg jpeg image. kgifimagemime image/gif gif image. kfilemime application/x-moz-file an arbitrary file (is this an nsifile?) kurlmime text/x-moz-url a mozilla url object; this is a text string containing the url, a newline (\n), then the title of the page. kurldatamime text/x-moz-url-data a string containing only a url. kurldescriptionmime text/x-moz-url-desc a string containing only a description. kurlprivatemime text/x-moz-url-priv the same as kurldatamime, except intended for private use only. knativeimagemime application/x-moz-nativeimage an image in gecko's native internal...

nsIWebContentHandlerRegistrar
dow contentwindow) methods registercontenthandler summary of registercontenthandler void registercontenthandler( in domstring mimetype, in domstring uri, in domstring title, in nsidomwindow contentwindow ); parameters mimetype the desired mime type as a string uri the uri to the handler as a string. title the title of the handler presented to the user as a string. contentwindow the dom content window from which the method has been called. registerprotocolhandler summary of registerprotocolhandler void registerprotocolhandler( in domstring protocol, in domstring uri, in domstring title, in nsidomwindow contentwindow ); parameters protocol the protocol the site wishes to handle, ...
..., in domstring title, in nsidomwindow contentwindow ); parameters protocol the protocol the site wishes to handle, specified as a string. uri the uri to the handler as a string. you must include "%s" to indicate where to insert the escaped uri of the document to be handled. otherwise ns_error_dom_syntax_err will be thrown. this string must also be of either the http or https schemes. title the title of the handler presented to the user as a string. contentwindow the dom content window from which the method has been called. note: script must execute from same domain as uri or else it will throw permission error. can bypass this by opening about:config and setting preference of gecko.handlerservice.allowregisterfromdifferenthost to true. examples register a webmail service as...

nsIWindowMediator
zlevelbottom 2 send window to bottom. zlevelbelow 3 place window below some window. methods addlistener() register a listener for window status changes. void addlistener( in nsiwindowmediatorlistener alistener ); parameters a...
...parameters awindow the window to remove. native code only!updatewindowtimestamp call this method when a window gains focus. it's a primitive means of determining the most recent window. it's no longer necessary and it really should be removed. void updatewindowtimestamp( in nsixulwindow awindow ); parameters awindow the window which has gained focus. native code only!updatewindowtitle call this method when a window's title changes. listeners (see addlistener()) will be notified through their onwindowtitlechange method. void updatewindowtitle( in nsixulwindow awindow, in wstring intitle ); parameters awindow the window whose title has changed. intitle the window's new title. examples in the examples below, type specifies the type of windows you want to search. y...

ContentIndex.add() - Web APIs
used in user-visible lists of content. description: a string description of the item. ...
...used in user-visible lists of content. description: a string description of the item. ...

DOMImplementation.createHTMLDocument() - Web APIs
example this example creates a new html document and inserts it into an <iframe> in the current document. ...
... example this example creates a new html document and inserts it into an <iframe> in the current document. ...

Document.enableStyleSheetsForSet() - Web APIs
enables the style sheets matching the specified name in the current style sheet set, and disables all other style sheets (except those without a title, which are always enabled). syntax document.enablestylesheetsforset(name); parameters name the name of the style sheets to enable. all style sheets with a title that match this name will be enabled, while all others that have a title will be disabled. specify an empty string for the name parameter to disable all alternate and preferred style sheets (but not the persistent style sheets; that is, those with no title attribute). notes title matches are case-sensitive. calling this method with a null name has no effect; if you want to disable all alternate and preferred style sheets, you must pass "", the empty string. stylesheets th...
...an empty string for the name parameter to disable all alternate and preferred style sheets (but not the persistent style sheets; that is, those with no title attribute). notes title matches are case-sensitive. calling this method with a null name has no effect; if you want to disable all alternate and preferred style sheets, you must pass "", the empty string. stylesheets that don't have a title are never affected by this method. this method never affects the values of document.laststylesheetset or document.preferredstylesheetset. example document.enablestylesheetsforset("some style sheet set name"); ...

Document.styleSheetSets - Web APIs
duplicates are dropped from the list (using a case-sensitive comparison). ...
...duplicates are dropped from the list (using a case-sensitive comparison). ...

History.pushState() - Web APIs
o the user's disk so they can be restored after the user restarts the browser, we impose a size limit of 640k characters on the serialized representation of a state object. if you pass a state object whose serialized representation is larger than this to pushstate(), the method will throw an exception. if you need more space than this, you're encouraged to use sessionstorage and/or localstorage. title most browsers currently ignore this parameter, although they may use it in the future. passing the empty string here should be safe against future changes to the method. alternatively, you could pass a short title for the state to which you're moving. url optional the new history entry's url is given by this parameter. note that the browser won't attempt to load this url after a call to pushsta...
...ur new history entry. with the hash-based approach, you need to encode all of the relevant data into a short string. note that pushstate() never causes a hashchange event to be fired, even if the new url differs from the old url only in its hash. examples this creates a new browser history state setting the state, title, and url. javascript const state = { 'page_id': 1, 'user_id': 5 } const title = '' const url = 'hello-world.html' history.pushstate(state, title, url) specifications specification status comment html living standardthe definition of 'history.pushstate()' in that specification. living standard no change from html5. html5the definition of 'history.pushstate()' in that specification. recommendation initial definition. ...

History - Web APIs
nstance, specifying -1 when there are no previously-visited pages in the session history), this method silently has no effect. calling go() without parameters or a value of 0 reloads the current page. internet explorer lets you specify a string, instead of an integer, to go to a specific url in the history list. pushstate() pushes the given data onto the session history stack with the specified title (and, if provided, url). the data is treated as opaque by the dom; you may specify any javascript object that can be serialized. note that all browsers but safari currently ignore the title parameter. for more information, see working with the history api. replacestate() updates the most recent entry on the history stack to have the specified data, title, and, if provided, url. the data is trea...
...for more information, see working with the history api. specifications specification status comment html living standardthe definition of 'history' in that specification. living standard adds the scrollrestoration attribute. html5the definition of 'history' in that specification. ...

IDBCursor.delete() - Web APIs
action is inactive. readonlyerror the transaction mode is read-only. invalidstateerror the cursor was created using idbindex.openkeycursor, is currently being iterated, or has iterated past its end. example in this simple fragment we create a transaction, retrieve an object store, then use a cursor to iterate through all the records in the object store. if the albumtitle of the current cursor is "grace under pressure", we delete that entire record using var request = cursor.delete();. the cursor does not require us to select the data based on a key; we can just grab all of it. also note that in each iteration of the loop, you can grab data from the current record under the cursor object using cursor.value.foo. for a complete working example, see our idbcursor exa...
... for a complete working example, see our idbcursor example (view example live.) function deleteresult() { list.innerhtml = ''; var transaction = db.transaction(['rushalbumlist'], 'readwrite'); var objectstore = transaction.objectstore('rushalbumlist'); objectstore.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { if(cursor.value.albumtitle === 'grace under pressure') { var request = cursor.delete(); request.onsuccess = function() { console.log('deleted that mediocre album from 1984. even power windows is better.'); }; } else { var listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.albumtitle + '</strong>, ' + cursor.value.year; list.

IDBCursor.key - Web APIs
's key can be any data type. note: this feature is available in web workers. syntax var key = cursor.key; value a value of any type. example in this simple fragment we create a transaction, retrieve an object store, then use a cursor to iterate through all the records in the object store. within each iteration we log the key of the cursor to the console, something like this (its the album title in each case, which is our key). the cursor does not require us to select the data based on a key; we can just grab all of it. also note that in each iteration of the loop, you can grab data from the current record under the cursor object using cursor.value.foo. for a complete working example, see our idbcursor example (view example live.) function displaydata() { var transaction = db.transact...
... recommendation indexed database api draftthe defini...

IDBCursor.primaryKey - Web APIs
type. note: this feature is available in web workers. syntax var value = cursor.primarykey; value a value of any data type. example in this simple fragment we create a transaction, retrieve an object store, then use a cursor to iterate through all the records in the object store. within each iteration we log the primary key of the cursor to the console, something like this (its the album title in each case, which is our primarykey): hemispheres the cursor does not require us to select the data based on a key; we can just grab all of it. also note that in each iteration of the loop, you can grab data from the current record under the cursor object using cursor.value.foo. for a complete working example, see our idbcursor example (view example live.) function displaydata() { var tran...
... recommendation indexed database api d...

IDBCursor.update() - Web APIs
property in the value at the object store's key path does not match the key in this cursor's position. datacloneerror the data being stored could not be cloned by the internal structured cloning algorithm. example in this simple fragment we create a transaction, retrieve an object store, then use a cursor to iterate through all the records in the object store. if the albumtitle of the current cursor is "a farewell to kings", we update year the album was released using var request = cursor.update();. note that you cannot change primary keys using cursor.update(), hence us not changing the album title; this would ruin the integrity of the data. in such a situation, you would have to delete the record altogether and then add a new one using idbobjectstore.add. note also th...
...omplete working example, see our idbcursor example (view example live.) function updateresult() { list.innerhtml = ''; const transaction = db.transaction(['rushalbumlist'], 'readwrite'); const objectstore = transaction.objectstore('rushalbumlist'); objectstore.opencursor().onsuccess = function(event) { const cursor = event.target.result; if (cursor) { if (cursor.value.albumtitle === 'a farewell to kings') { const updatedata = cursor.value; updatedata.year = 2050; const request = cursor.update(updatedata); request.onsuccess = function() { console.log('a better album year?'); }; }; const listitem = document.createelement('li'); listitem.innerhtml = '<strong>' + cursor.value.albumtitle + '</strong>, ' + cu...

IDBRequest.error - Web APIs
nsuccess gets the associated record from the idbobjectstore (made available as objectstoretitlerequest.result), updates one property of the record, and then puts the updated record back into the object store. also included at the bottom is an onerror function that reports what the error was if the request fails. ...
...ack into the object store. also included at the bottom is an onerror function that reports what the error was if the request fails. ...

Checking when a deadline is due - Web APIs
ate objects, but of course humans don't want to enter deadline information in the same format javascript understands. human-readable dates are quite different, with a number of different representations. recording the date information to provide a reasonable user experience on mobile devices, and to cut down on ambiguities, i decided to create an html form with: a text input for entering a title for your to-do list. this is the least avoidable bit of user typing. number inputs for the hour and minute parts of the deadline. on browsers that support type="number", you get a nice little up and down arrow number picker. on mobile platforms you tend to get a numeric keypad for entering data, which is helpful. on others you just get a standard text input, which is okay. <select> elements for ...
...atenotification() function (read using indexeddb for an explanation): // now we need to update the value of notified to "yes" in this particular data object, so the // notification won't be set off on it again // first open up a tranaction as usual var objectstore = db.transaction(['todolist'], "readwrite").objectstore('todolist'); // get the to-do list object that has this title as it's title var request = objectstore.get(title); request.onsuccess = function() { // grab the data object returned as the result var data = request.result; // update the notified value in the object to "yes" data.notified = "yes"; // create another request that inserts the item back into the database var requestupdate = objectstore.put(data); ...

Navigator.registerProtocolHandler() - Web APIs
scheme a string containing the protocol the site wishes to handle. for example, you can register to handle sms text message links by passing the "sms" scheme. url a string containing the url of the handler. this url must include %s, as a placeholder that will be replaced with the escaped url to be handled. note: the handler url must us the https scheme. older browsers also supported http. title a human-readable title string for the handler. this will be displayed to the user, such as prompting “allow this site to handle [scheme] links?” or listing registered handlers in the browser’s settings. note: the title has been removed from the spec due to spoofing concerns, but all current browsers still require it. it is recommended to always set the title, since browsers that support ...
... exceptions securityerror the user agent blocked the registration. ...

Using the Notifications API - Web APIs
fication.requestpermission().then(); } catch(e) { return false; } return true; } we basically try to see if the .then() method is available on requestpermission(). if so, we move on and return true. if it fails, we return false in the catch() {} block. creating a notification creating a notification is easy; just use the notification constructor. ...
...constructor. this constructor expects a title to display within the notification and some options to enhance the notification such as an icon or a text body. for example, in the to-do-list example we use the following snippet to create a notification when required (found inside the createnotification() function): var img = '/to-do-notifications/img/icon-128.png'; var text = 'hey! your task "' + title + '" is now overdue.'; var notification = new notification('to do list', { body: text, icon: img }); closing notifications used close() to remove a notification that is no longer relevant to the user (e.g. the user already read the notification on the webpage, in the case of a messaging app, or the following song is already playing in a music app to notifies upon song changes). most modern brows...

Page Visibility API - Web APIs
en === undefined) { console.log("this demo requires a browser, such as google chrome or firefox, that supports the page visibility api."); } else { // handle page visibility change document.addeventlistener(visibilitychange, handlevisibilitychange, false); // when the video pauses, set the title. ...
...; } else { // handle page visibility change document.addeventlistener(visibilitychange, handlevisibilitychange, false); // when the video pauses, set the title. // this shows the paused videoelement.addeventlistener("pause", function(){ document.title = 'paused'; }, false); // when the video plays, set the title. videoelement.addeventlistener("play", function(){ document.title = 'playing'; }, false); } properties added to the document interface the page visibility api adds the following properties to the document interface: document.hidden read only returns true if the page is in a state considered to be hidden to the user, and false otherwise. document.visibilitystate read only a domstring indicating the document's current visibility state. possible value...

PushEvent.data - Web APIs
mypushdata = pushevent.data; value a pushmessagedata object. examples the following example takes data from a pushevent and displays it on all of the service workers' clients. ...
... pushevent.data; value a pushmessagedata object. examples the following example takes data from a pushevent and displays it on all of the service workers' clients. ...

PushEvent - Web APIs
. methods inherits methods from its parent, extendableevent. examples the following example takes data from a pushevent and displays it on all of the service worker's clients. ...
...inherits methods from its parent, extendableevent. examples the following example takes data from a pushevent and displays it on all of the service worker's clients. ...

SVGDocument - Web APIs
ocument object of a different type, such as an htmldocument object. ...
... referrer domstring returns the uri of the page that linked to this page. the value is an empty string if the user navigated to the page directly (not through a link, but, for example, via a bookmark). rootelement svgsvgelement the root "svg" in the document hierarchy. title domstring the title of a document as specified by the "title" sub-element of the "svg" root element (i.e., <svg><title>here is the title</title>...</svg>) url domstring the complete uri of the document. methods the svgdocument interface does not provide any specific methods. bro...

ServiceWorkerGlobalScope.onpush - Web APIs
ll of the service worker's clients. ...
...vice worker's clients. ...

ServiceWorkerRegistration.showNotification() - Web APIs
it can have the following properties: actions: an array of actions to display in the notification. ...
...it can have the following properties: actions: an array of actions to display in the notification. ...

Window.open() - Web APIs
the vertical scrollbar if present. the width value does not include the sidebar if it is expanded. the minimum required value is 100. height or innerheight specifies the height of the content area, viewing area of the new secondary window in pixels. the height value includes the height of the horizontal scrollbar if present. the height value does not include other ui parts such as location bar, title bar, tab bar, etc. the minimum required value is 100. if the windowfeatures parameter is non-empty and no size features are defined, then the new window dimensions will be the same as the dimensions of the most recently rendered window. browser-dependent size features do not use them. outerwidth (only on firefox, obsolete from firefox 80) specifies the width of the whole browser window i...
...of opening/handling a referenced resource. this form of code also interferes with advanced features in tab-capable browsers: eg. middle-click on links, ctrl+click on links, ctrl+enter on links, "mouse gestures" features. always identify links that will create (or will re-use) a new, secondary window identify links that will open new windows in a way that helps navigation for users by coding the title attribute of the link, by adding an icon at the end of the link or by coding the cursor accordingly. the purpose is to warn users in advance of context changes to minimize confusion on the user's part: changing the current window or popping up new windows can be very disorienting to users (back toolbar button is disabled). "users often don't notice that a new window has opened, especially if th...

Window.resizeTo() - Web APIs
example this function resizes the window so that it takes up one quarter of the available screen. see the screen.availwidth and screen.availheight properties. ...
... example this function resizes the window so that it takes up one quarter of the available screen. see the screen.availwidth and screen.availheight properties. ...

ARIA: feed role - Accessibility
ze="-1" to indicate that the size of the feed is not known. another feature of the feed pattern is skim reading: articles within a feed can contain both an accessible name with the aria-label and a description with an aria-describedby, suggesting to screen readers which elements to speak after the label when navigating by article. by identifying the elements inside of an article that provide the title and the primary content, assistive technologies can provide functions that enable users to jump from article to article and efficiently discern which articles they want to read. the feed pattern enables reliable assistive technology reading mode interaction by establishing the following interoperability agreement between the web page and assistive technologies: in the context of a feed, the we...
... busy, such as when articles are being added or removed from the feed, set aria-busy="true" during the update operation. make sure it's reset to false when the operation is complete or the changes may not become visible. article each section of content in a feed should be contained in an <article> or element with role article. each article should have an aria-labelledby referring to the article title or other child that can serve as a distinguishing label. each article should preferably have aria-describedby referring to one or more elements inside the article that serve as the primary content of the article. each article element has aria-posinset set to a value that represents its position in the feed and an aria-setsize set to a value that represents either the total number of articles that ...

Mobile accessibility checklist - Accessibility
ols such as links, buttons, and form fields are focusable by default. non-standard controls must have an appropriate aria role assigned to them, such as button, link, or checkbox. focus should be handled in a logical order and consistent manner. text equivalents text equivalent must be provided for every non-strictly presentational non-text element within the app. use alt and title where appropriate (see steve faulkner's post about using the html title attribute for a good guide.) if the above attributes are not applicable, use appropriate aria states and properties such as aria-label, aria-labelledby, or aria-describedby. images of text must be avoided. all user interface components with visible text (or image of text) as labels must have the same text available i...
...anges must be provided via aria states such as aria-checked, aria-disabled, aria-selected, aria-expanded, and aria-pressed. orientation content should not be restricted to a single orientation, such as portrait or landscape, unless essential. wcag 2.1: orientation examples of when an orientation is esssential is a piano application or a bank cheque. general guidelines an app title must be provided. headings must not break hierarchical structure <h1>top level heading</h1> <h2>secondary heading</h2> <h2>another secondary heading</h2> <h3>low level heading</h3> aria landmark roles should be used to describe an app or document structure, such as banner, complementary, contentinfo, main, navigation, search. for touch events, at least one of the following must be t...

Event reference
lected inside the browser <iframe> content changes. note that this is deprecated, and newer implementations use mozbrowsercaretstatechanged instead. mozbrowsershowmodalprompt firefox os browser api-specific sent when alert(), confirm() or prompt() are called within a browser <iframe> mozbrowsertitlechange firefox os browser api-specific sent when the document.title changes within a browser iframe. mozbrowserusernameandpasswordrequired firefox os browser api-specific sent when an http authentication is requested. mozbrowservisibilitychange firefox os browser api-specific sent when the visibility state of the current browser iframe <iframe> changes, for example due to a call to setvisible(). mozgamepadbuttondown ...
...voke the edge ui (win8 only). mozafterpaint addons specific content has been repainted. dompopupblocked addons specific a popup has been blocked. domwindowcreated addons specific a window has been created. domwindowclose addons specific a window is about to be closed. domtitlechanged addons specific the title of a window has changed. domlinkadded addons specific a link has been added a document. domlinkremoved addons specific a link has been removed inside from a document. dommetaadded addons specific a meta element has been added to a document. dommetaremoved addons specific a meta element has been removed from a document. ...

HTML attribute reference - HTML: Hypertext Markup Language
s in an editing host (e.g., using contenteditable attribute). ismap <img> indicates that the image is part of a server-side image map. itemprop global attribute keytype <keygen> specifies the type of key generated. kind <track> specifies the kind of text track. label <optgroup>, <option>, <track> specifies a user-readable title of the element. lang global attribute defines the language used in the element. language <script> defines the script language used in the element. loading <img>, <iframe> indicates if the element should be loaded lazily (loading="lazy") or loaded immediately (loading="eager"). wip: whatwg pr #3752 list <input> identifies a list ...
...ll override styles previously set. summary <table> tabindex global attribute overrides the browser's default tab order and follows the one specified instead. target <a>, <area>, <base>, <form> specifies where to open the linked document (in the case of an <a> element) or where to display the response recieved (in the case of a <form> element) title global attribute text to be displayed in a tooltip when hovering over the element. translate global attribute specify whether an element’s attribute values and the values of its text node children are to be translated when the page is localized, or whether to leave them unchanged. type <button>, <input>, <command>, <embed>, <object>, <script>, <source>, <style>, ...

<em>: The Emphasis element - HTML: Hypertext Markup Language
tes the <em> element is for words that have a stressed emphasis compared to surrounding text, which is often limited to a word or words of a sentence and affects the meaning of the sentence itself. typically this element is displayed in italic type. however, it should not be used simply to apply italic styling; use the css font-style property for that purpose. use the <cite> element to mark the title of a work (book, play, song, etc.). use the <i> element to mark text that is in an alternate tone or mood, which covers many common situations for italics such as scientific names or words in other languages. use the <strong> element to mark text that has greater importance than surrounding text. <i> vs. <em> new developers are often confused at seeing multiple elements that produce similar resu...
...ich should you use? by default, the visual result is the same. however, the semantic meaning is different. the <em> element represents stress emphasis of its contents, while the <i> element represents text that is set off from the normal prose, such a foreign word, fictional character thoughts, or when the text refers to the definition of a word instead of representing its semantic meaning. (the title of a work, such as the name of a book or movie, should use <cite>.) this means the right one to use depends on the situation. neither is for purely decorational purposes, that's what css styling is for. an example for <em> could be: "just do it already!", or: "we had to do something about it". a person or software reading the text would pronounce the words in italics with an emphasis, using verb...

<input>: The Input (Form Input) element - HTML: Hypertext Markup Language
present but is not specified or is invalid, no regular expression is applied and this attribute is ignored completely. if the pattern attribute is valid and a non-empty value does not match the pattern, constraint validation will prevent form submission. tip: if using the pattern attribute, inform the user about the expected format by including explanatory text nearby. you can also include a title attribute to explain what the requirements are to match the pattern; most browsers will display this title as a tooltip. the visible explanation is required for accessibility. the tooltip is an enhancement. see client-side validation for more information. placeholder the placeholder attribute is a string that provides a brief hint to the user as to what kind of information is expected ...
...ement can take input focus (is focusable), if it should participate to sequential keyboard navigation. as all input types except for input of type hidden are focusable, this attribute should not be used on form controls, because doing so would require the management of the focus order for all elements within the document with the risk of harming usability and accessibility if done incorrectly. title global attribute valid for all elements, including all input types, containing a text representing advisory information related to the element it belongs to. such information can typically, but not necessarily, be presented to the user as a tooltip. the title should not be used as the primary explanation of the purpose of the form control. instead, use the <label> element with a for attribute s...

<link>: The External Resource Link element - HTML: Hypertext Markup Language
els>x<height in pixels>. each of these sizes must be contained in the resource. note: most icon formats are only able to store one single icon; therefore most of the time the sizes attribute contains only one entry. ms's ico format does, as well as apple's icns. ico is more ubiquitous, so you should use this format if cross-browser support is a concern (especially for old ie versions). title the title attribute has special semantics on the <link> element. when used on a <link rel="stylesheet"> it defines a preferred or an alternate stylesheet. incorrectly using it may cause the stylesheet to be ignored. type this attribute is used to define the type of the content linked to. the value of the attribute should be a mime type such as text/html, text/css, and so on. the common use of t...
...ow recommended practice. it is also used on rel="preload" link types, to make sure the browser only downloads file types that it supports. non-standard attributes methods the value of this attribute provides information about the functions that might be performed on an object. the values generally are given by the http protocol when it is used, but it might (for similar reasons as for the title attribute) be useful to include advisory information in advance in the link. for example, the browser might choose a different rendering of a link as a function of the methods specified; something that is searchable might get a different icon, or an outside link might render with an indication of leaving the current site. this attribute is not well understood nor supported, even by the defining br...

itemid - HTML: Hypertext Markup Language
how items with the same identifier are handled. note: the whatwg definition specifies that an itemid must be a url. however, the following example correctly illustrates that a urn may also be used. this inconsistency may reflect the incomplete nature of the microdata specification. ...
...e.net/book" itemid="urn:isbn:0-330-34032-8"> <dt>title <dd itemprop="title">the reality dysfunction <dt>author <dd itemprop="author">peter f. hamilton <dt>publication date <dd><time itemprop="pubdate" datetime="1996-01-26">26 january 1996</time> </dl> structured data itemscope itemtype: itemid http://vocab.example.net/book: urn:isbn:0-330-34032-8 itemprop title the reality dysfunction itemprop author peter f. hamilton itemprop pubdate 1996-01-26 result specifications specification status comment html living standardthe definition of 'itemid' in that specification. living standard ...

Link types - HTML: Hypertext Markup Language
the other using an <a>, <area>, <form>, or <link> element. list of the defined link types and their significance in html link type description allowed in these elements not allowed in these elements alternate if the element is <link> and the rel attribute also contains the stylesheet type, the link defines an alternative style sheet; in that case the title attribute must be present and not be the empty string. if the type is set to application/rss+xml or application/atom+xml, the link defines a syndication feed. the first one defined on the page is the default. otherwise, the link defines an alternative page, of one of these types: for another medium, like a handheld device (if the media attribute is set) in another la...
...nd is only implemented by versions of firefox prior to firefox 63. <a>, <area>, <link> <form> stylesheet defines an external resource to be used as a stylesheet. if the type is not set, the browser should assume it is a text/css stylesheet until further inspection. if used in combination with the alternate keyword, it defines an alternative style sheet; in that case the title attribute must be present and not be the empty string. <link> <a>, <area>, <form> tag indicates that the hyperlink refers to a document describing a tag that applies to this document. note: this link type should not be set on links to a member of a tag cloud as these do not apply to a single document but to a set of pages. <a>, <area> <link>, <form> up ...

SVG 1.1 Support in Firefox - SVG: Scalable Vector Graphics
ttributes: contentscripttype, contentstyletype, viewport, currentview unimplemented bindings: getintersectionlist, getenclosurelist, checkintersection, checkenclosure g implemented. defs implemented. desc implemented. only stored in the dom, no user interface. title implemented. the title is displayed as a tooltip when the mouse hovers over the svg object. metadata implemented. only stored in the dom, no user interface. symbol implemented. use implemented. doesn't completely follow <svg:use> cascading rules (bug 265894). doesn't de...
...efuncr implemented. fefuncg implemented. fefuncb implemented. fefunca implemented. cursor module cursor not implemented (bug 177193). hyperlinking module a only xlink:href, xlink:show, xlink:target and xlink:title attributes implemented. view module view implemented in gecko 15.0 (bug 512525). . scripting module script implemented. animation module animate implemented set implemented animatemotion implemented ...

Navigator.mozNotification - Archive of obsolete content
notification createnotification(in domstring title, in domstring description, in domstring iconurl optional); methods createnotification() creates and returns a notification object that can be used to display the specified message with an optional url. notification createnotification( in domstring title, in domstring description, in domstring iconurloptional ); parameters title the notification title. description the text to display in the notification. iconurl optional a url identifying the image to display in the notification. return value a new notification object. permissions when using notifications in an open web app, be sure to add the desktop-notification permission in your manifest file: "permissions": { "desktop-notification": {} } usage notes ...

port - Archive of obsolete content
d({ include: ['*'], contentscriptfile: self.data.url("content-script.js"), onattach: setuplistener }); function setuplistener(worker) { worker.port.on('loaded', function(pageinfo) { console.log(pageinfo[0]); console.log(pageinfo[1]); }); } //content-script.js self.port.emit('loaded', [ document.location.tostring(), document.title ]); ...

Module structure of the SDK - Archive of obsolete content
"sdk", to the module you want to use. for high-level modules this is just sdk/<module_name>, and for low-level modules it is sdk/<path_to_module>/<module_name>: // load the high-level "tabs" module var tabs = require("sdk/tabs"); // load the low-level "uuid" module var uuid = require('sdk/util/uuid'); the path to specify for a low-level module is given along with the module name itself in the title of the module's documentation page (for example, system/environment). although the sdk repository in github includes copies of these modules, they are built into firefox and by default, when you run or build an add-on using jpm run or jpm xpi, it is the versions of the modules in firefox that are used. if you need to use a different version of the modules, you can do this by checking out the vers...

indexed-db - Archive of obsolete content
database created will be unique and private per add-on, and is not linked to any website database. the module cannot be used to interact with a given website database. see bug 778197 and bug 786688. example this example uses the action button api, which is only available from firefox 29 onwards. here's a complete add-on that adds two buttons to the browser: the button labeled "add" adds the title of the current tab to a database, while the button labeled "list" lists all the titles in the database. the add-on implements helper functions open(), additem() and getitems() to open the database, add a new item to the database, and get all items in the database. var { indexeddb, idbkeyrange } = require('sdk/indexed-db'); var database = {}; database.onerror = function(e) { console.error(e.v...

notifications - Archive of obsolete content
ts notifications service is not running: if firefox was started normally, notifications are logged to firefox's error console if the user launched firefox from the command line, notifications are logged to the terminal. globals functions notify(options) displays a transient notification to the user. parameters options : object optional options: name type title string a string to display as the message's title. text string a string to display as the body of the message. iconurl string the url of an icon to display inside the message. it may be a remote url, a data uri, or a url returned by the self module. onclick function a function to be called when the user clicks the m...

panel - Archive of obsolete content
n normal web pages do not work inside panels: prior to firefox 33, you don't get a context menu. from firefox 33 you can enable a context menu by passing contextmenu: true to the panel's constructor. the html <select> element doesn't work. the html <datalist> element doesn't give you autocomplete suggestions (bug 918600). you can't embed flash (bug 952578). you can't provide tooltips using title attributes (bug 918600). security warning pages (the "this connection is untrusted" warning) does not work, so panels which trigger it will be broken (bug 1031554). mouse button shortcuts, such as using the middle button to open a link in a new page, don't work. scrolling using keyboard doesn't work properly (bug 1001914) globals constructors panel(options) creates a panel. parameters op...

widget - Archive of obsolete content
dy");', onmessage: function(message) { if (message == "ready") widget.postmessage("me too"); } }); globals constructors widget(options) creates a new widget. the widget is immediately added to the add-on bar. parameters options : object required options: name type label string a string description of the widget used for accessibility, title bars, and error reporting. id string a string used to identify your widget in order to save its location when the user moves it in the browser. this string has to be unique and must not be changed over time. optional options: name type content string an optional string value containing the displayed content of the widget.

places/history - Archive of obsolete content
emits data, error, and end. data events are emitted for every individual search result found, whereas end events are emitted as an aggregate of an entire search, passing in an array of all results into the handler. events data the data event is emitted for every item returned from a search. arguments object : this is an object representing a history entry. contains url, time, accesscount and title of the entry. error the error event is emitted whenever a search could not be completed. arguments string : a string indicating the error that occurred. end the end event is called when all search results have returned. arguments array : the value passed into the handler is an array of all entries found in the history search. each entry is an object containing the properties url, time, acc...

tabs/utils - Archive of obsolete content
ab element. returns browser : gettabid(tab) get the specified tab's id. on firefox it's derived from its linkedpanel property. parameters tab : tab a xul tab element. returns id : the id for this tab. gettabforid(id) get the tab identified by id. parameters id : on firefox it's derived from its linkedpanel property. returns tab : tab a xul tab element. gettabtitle(tab) get the title of the document hosted by the specified tab, or the tab's label if the tab doesn't host a document. parameters tab : tab a xul tab element. returns string : settabtitle(tab, title) set the title of the document hosted by the specified tab, or the tab's label if the tab doesn't host a document. parameters tab : tab a xul tab element. title : string the new title. gettabcontentwindow(ta...

window/utils - Archive of obsolete content
dom document, images, and any other sub-resources. parameters window : nsidomwindow returns boolean: true if the document is completely loaded. isbrowser(window) returns true if the given window is a firefox browser window: that is, its document has a "windowtype" of "chrome://browser/content/browser.xul". parameters window : nsidomwindow returns boolean getwindowtitle(window) get the title of the document hosted by the given window parameters window: nsidomwindow returns string: this document's title. isxulbrowser(window) returns true if the given window is a xul window. parameters window : nsidomwindow returns boolean getfocusedwindow() gets the child window within the topmost browser window that is focused. see nsifocusmanager for more details. returns nsidomwindow ...

cfx to jpm - Archive of obsolete content
f --profiledir and --overload-modules, use --profile and --overload. instead of using --force-mobile, explicitly add fennec to engines section of your package.json. package.json fields many package.json fields are implicit commands to cfx. in jpm, we've removed support for some of these fields, and are still working on supporting some others. permanently removed fields data fullname - use title instead lib packages tests icon64 package.json escaping where with cfx you might have had to escape with 2 upto 3 backslashes ( \ ), jpm only needs one now. ...

jpm - Archive of obsolete content
jpm sign package your add-on as an xpi file, and then retrieve a new xpi signed by mozilla. jpm init this command initializes a new add-on from scratch. create a new directory, change into it, and run jpm init. mkdir my-addon cd my-addon jpm init you'll then be asked to supply some information about your add-on: this will be used to create your add-on's package.json file. title name: this defaults to the name of the directory in which you are running jpm init. unless an id field is present in package.json, jpm prepends "@" to name and use the result as the id field in the add-on's install manifest. version description entry point (which maps to "main" in package.json) author engines (supported applications) license most of these fields have a default, which is s...

Inline options - Archive of obsolete content
ing (in the #123456 format) file browse button and label string directory browse button and label string menulist menulist dependent on the menu item values radio radio buttons dependent on the radio values control button no pref stored the pref attribute should have the full name of the preference to be stored. the title attribute is used as a label for the controls. to set a description, either use the desc attribute, or a text node as a child of the <setting> tag. settings are tied to actual preferences, except the button setting, which is designed more for actions. some examples: <!-- boolean examples --> <setting pref="extensions.myaddon.bool1" type="bool" title="boolean 1"/> <setting pref="extensions.myadd...

Listening to events in Firefox extensions - Archive of obsolete content
for events from. keep in mind that the events may come from any frame within the browser or, for a tabbrowser, any of the browsers within it. some of the more interesting dom events you may wish to monitor are listed here: event description domlinkadded dispatched when a new html <link> element is detected in the document. domtitlechanged dispatched when the title of the page changes. domcontentloaded dispatched when the initial dom for the page is completely loaded. load dispatched after the page—including images—has first finished loading. unload dispatched when the user has navigated away from the page. pageshow dispatched when a page is newly displayed. pagehide dispatched when a page is hi...

Appendix: What you should know about open-source software licenses - Archive of obsolete content
e for your own use → support is a nightmare. do you hate the idea of your software ever being embedded in a commercial package? → choose the gpl. do you enthusiastically support the free software movement? → choose the gpl. do you want your code to be embedded in a certain oss project? → choose the same license as that project. none of the above: choose the modified bsd license. the title hints at matsumoto’s diagnostic approach, since it mentions “free software.” this is slightly different from open source. (matsumoto updated his free software license diagnostic for a special open-source section in the january 2007 edition of softbank’s open source magazine.) if a company is considering releasing its own software as open source, it should consider dual-licensing or the cpl...

Adding Toolbars and Toolbar Buttons - Archive of obsolete content
verlay stuff. --> </overlay> one detail that is easy to overlook is the fact that the toolbarpalette element is outside of the window element. if you put the toolbarpalette element inside the window element in your overlay, some weird errors will begin to happen. always set the label and tooltiptext attributes of a toolbarbutton. in the case of a toolbaritem element (discussed later), use the title attribute instead of label. tooltips are very important for users that want to know what a button does before clicking it. setting the image for a toolbar button is done with css: #xulschoolhello-hello-world-button { list-style-image: url("chrome://xulschoolhello/skin/hello-world.png"); } it's not really that simple to set the image for a toolbar button, because we need to consider the appe...

The Essentials of an Extension - Archive of obsolete content
formation firefox and other mozilla applications need to install an add-on. any errors or missing information will cause the installation process to fail, or the extension to be installed in a disabled state. the chrome.manifest file chrome is the set of user interface elements of the application window that are outside of a window's content area. toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome. taken from chrome registration. in other words, the chrome is everything you see in firefox. all firefox windows can be seen as having two parts: (1) the chrome and (2) possibly a content area, like the one that displays web pages in a firefox tab. windows like the downloads window are pure chrome. most of the code for an ...

User Notifications and Alerts - Archive of obsolete content
he user clicking on the alert. another advantage is that you use an xpcom service to do this (nsialertsservice), so you can easily trigger alerts from chrome and non-chrome code. on the other hand, alerts are displayed only temporarily using the alerts service is similar to using notification boxes: let alertsservice = cc["@mozilla.org/alerts-service;1"].getservice(ci.nsialertsservice); let title = this._bundle.getstring("xulschoolhello.greeting.title"); let message = this._bundle.getstring("xulschoolhello.greeting.label"); alertsservice.showalertnotification( "chrome://xulschoolhello/skin/hello-notification.png", title, message, true, "", this, "xulschool hello message"); we pass this as an argument, assuming that this is an object that implements nsiobserver. we do this when we n...

Index of archived content - Archive of obsolete content
beginner tutorials creating reusable content with css and xbl underscores in class and id names xml data xul user interfaces case sensitivity in class and id names creating a dynamic status bar extension creating a status bar extension element title gecko compatibility handbook getting the page url in npapi plugin index index of archived content inner-browsing extending the browser navigation paradigm install.js jxon list of former mozilla-based applications list of mozilla-based applications localizing an extension mmgc makefile...

Localizing an extension - Archive of obsolete content
g strings in xul files create the needed locale files each xul file that comprises the user interface for your extension should have a locale file in its locale directory. each locale file maps entity names referenced in the xul files to the strings themselves. the preference dialog, whose xul file is options.xul, has a corresponding options.dtd file that looks like this: <!entity options_window_title "stockwatcher 2 preferences"> <!entity options_symbol.label "stock to watch: "> the "options_window_title" entity maps to the string "stockwatcher 2 preferences", which is used as the title of the preference window. the stockwatcher2.dtd file contains the mappings for the stockwatcher2.xul file: <!entity panel_loading "loading..."> <!entity menu_refresh_now.label "refresh now"> <!entity menu_...

MCD, Mission Control Desktop, AKA AutoConfig - Archive of obsolete content
all"); pref("mcd.logging.dump", "all"); components.utils.import("resource:///modules/gloda/log4moz.js"); var log = log4moz.getconfiguredlogger("mcd"); // enable alerts. var alerts = components.classes["@mozilla.org/alerts-service;1"] .getservice(components.interfaces.nsialertsservice); // displayerror() is broken. let's override it. function displayerror(title, msg) { log.debug(title + ": " + msg); alerts.showalertnotification("chrome://branding/content/icon48.png", title, msg); } firefox it's the same principles as for firefox as it was described above for thunderbir. binary distributions should now include support for autoconfig (pref extension!) but unfortunately not for ldap calls :-( (cf. moz_ldap_xpcom=1). it is not vital in firefox as it is for us in thunderbird ...

Source code directories overview - Archive of obsolete content
that the content is a mail message, it looks up the appropriate listener (probably netscape messenger) and passes the mail message to it for display. it is generic and can hand the content off to internal components (like messenger), to plug-ins or helper apps. view contains c interfaces and code for different types of views (e.g. scrolling view). a view contains content but does not contain the title bar, borders or other decorations (which are contained by frames). this code serves to manipulate the individual content that it contains. for example, a scrolling view will find out the scroll bar positions and tell its content where to draw according the scroll bar thumbs. webshell contains c interfaces, c code, linux shell scripts and other files for embedding mozilla in other programs on vari...

Creating a Firefox sidebar extension - Archive of obsolete content
xample 1. package structure emptysidebar \- chrome |- content |- locale | \- en-us \- skin create all folders, except for skin. it is not used for this tutorial. the locale holds the locale, only the en-us locale is created. it is listed in example 2. the locale includes the name and shortcut keys for the sidebar. example 2. chrome/locale/emptysidebar.dtd <!entity emptysidebar.title "emptysidebar"> <!entity openemptysidebar.commandkey "e"> <!entity openemptysidebar.modifierskey "shift accel"> the content folder includes our sidebar, the emptysidebar.xul is shown in example 3. it creates a page holding one label. other elements can be included, please read the xul tutorials for more information. example 3. chrome/content/emptysidebar.xul <?xml version="1.0"?> <?xml-style...

Creating a Help Content Pack - Archive of obsolete content
nc:defaulttopic="" nc:base=""> </rdf:description> fill in the attributes as follows: rdf:about must be urn:root or your pack won't work. this attribute marks the start point in the rdf graph described by the file, and the help viewer searches for this element in order to query for further information (stored in child elements) about the content pack being parsed. nc:title is where you specify the title (e.g., "mozilla firefox help") for the help window. this attribute is required. nc:defaulttopic will hold the rdf:id of the topic you want displayed when the viewer first loads if none has been specified. this attribute also specifies what topic is loaded when the user hits the home button in the viewer. we'll get to exactly how to fill in this attribute later. this...

Microsummary XML grammar reference - Archive of obsolete content
warning: microsummary support was removed in gecko 6.0 (firefox 6.0 / thunderbird 6.0 / seamonkey 2.3) this article provides detailed information about the xml grammar used to build microsummary generators, describing each element and their attributes. for an introduction to how to create a microsummary, read the article creating a microsummary. ...

Migrate apps from Internet Explorer to Mozilla - Archive of obsolete content
: document.all[aid]); } differences between mozilla and internet explorer first, i'll discuss the differences in the way html behaves between mozilla and internet explorer. tooltips legacy browsers introduced tooltips into html by showing them on links and using the value of the alt attribute as a tooltip's content. the latest w3c html specification created the title attribute, which is meant to contain a detailed description of the link. modern browsers will use the title attribute to display tooltips, and mozilla only supports showing tooltips for that attribute and not the alt attribute. entities html markup can contain several entities, which the w3c web standards body has defined. you can reference entities through their numerical or character reference...

New Skin Notes - Archive of obsolete content
on most sites. --nickolay 01:34, 31 aug 2005 (pdt) ok, so i'm asking just to change this color. --gandalf 04:55, 31 aug 2005 (pdt) fine, changed. --dria the default link color is to bright. it's less readable than the old one. i'd suggest to use the color from cavedish. -- gandalf that was my first thought, too. -- axelhecht ok, i'll tone the main link colour down a bit. --dria page title needs "development skin" removed. -- dria the skin looks nice, but the links on the right are too small. if this is going to be the default skin used by editors, they are unacceptably small. --nickolay 01:59, 25 aug 2005 (pdt) i'm planning on doing up a special skin for editors in the future (with the edit tools and such closer to the top, etc). in the meantime, i'll bump the font size of those...

Tamarin Acceptance Test Template - Archive of obsolete content
provisions required by the gpl or the lgpl. if you do not delete * the provisions above, a recipient may use your version of this file under * the terms of any one of the mpl, the gpl or the lgpl. * * ***** end license block ***** */ var section = "test"; // provide a document reference (ie, actionscript section) var version = "as3"; // version of ecmascript or actionscript var title = "test"; // provide ecma section title or a description var bugnumber = ""; starttest(); // leave this alone /** * calls to addtestcase here. addtestcase is a function that is defined * in shell.as and takes three arguments: * - a string representation of what is being tested * - the expected result * - the actual result * * for example, a test might look like this...

loadResources - Archive of obsolete content
thin the xpi and not on the file system, as the following example demonstrates. example given a xpi with this internal structure: install.js bin/res_eg_2.properties bin/somefile.exe bin/... the following lines retrieve the properties as a javascript object and make the values accessible with the familiar "dot property" syntax: reseg2obj = loadresources("bin/res_eg_2.properties"); dump( reseg2obj.title ) ...

drawintitlebar - Archive of obsolete content
« xul reference home drawintitlebar type: boolean if this attribute is true, the top of the window's content area will begin at the top edge of the title bar, instead of below the title bar. this allows the window to draw in the title bar. this is supported only from window elements, and is ignored on platforms that don't support drawing into the title bar. ...

Attribute (XUL) - Archive of obsolete content
reeny searchbutton searchsessions searchlabel selected selectedindex seltype setfocus showcaret showcommentcolumn showpopup size sizemode sizetopopup smoothscroll sort sortactive sortdirection sortresource sortresource2 spellcheck src state statedatasource statusbar statustext style subject substate suppressonselect tabindex tabscrolling targets template timeout title toolbarname tooltip tooltiptext tooltiptextnew top type uri useraction validate value var visuallyselected wait-cursor width windowtype wrap wraparound ...

Popup Guide - Archive of obsolete content
popup types xul provides a number of different types of elements which may be used to create popup menus or other types of popup widgets, which vary based on the manner in which they are attached to an element and the manner in which they are opened. a brief overview of each type is listed here; more details for each type can be found by following the corresponding links. ...

Multiple Queries - Archive of obsolete content
the second query doesn't contain such a triple and will match all three of the photos. it the first query was used by itself, only one result would match. if the second query was used by itself, three results would match. when used together in this example, the results are combined and only three results are shown. however, you will probably notice that the one photo that matches the f...

Simple Query Syntax - Archive of obsolete content
of course, it should be obvious that this causes the value attribute to be set to the photo's title. you can get other predicates in the same way, just by using the predicate uri and prefixing it with 'rdf:'. you can also combine two in one attribute by separating them with a space or a caret (^) just as you can with the full syntax. for example: <label value="rdf:http://purl.org/dc/elements/1.1/title http://www.xulplanet.com/rdf/country"/> the 'rdf:' form is really equivalent to the <binding> tag in the full syntax. the subject of the binding is the result member resource, the predicate is the string that comes after 'rdf:' and the object isn't necessary as the value is replaced directly in the attribute. as with bindings, the value is not required to match, so the data doesn't have to exist ...

SeaMonkey - making custom toolbar (SM ver. 1.x) - Archive of obsolete content
button.js button.xul contents.rdf in contents.rdf, also change the displayname, description and author attributes. 2. create a working directory somewhere on your computer. use any name that you like for this directory. 3. ...

Adding Methods to XBL-defined Elements - Archive of obsolete content
tanonymousnodes(element)[0]), the second button is stored in the second array element and the third button is stored in the third array element. for code inside a binding method, you can pass 'this' as the parameter to getanonymousnodes(). the next example can be used to create text with a label. the method 'showtitle' can be used to show or hide the label. it works by getting a reference to the title element using the anonymous array and changing the visibility of it. xul: <box id="num" class="labeledbutton" title="number of things:" value="52"/> <button label="show" oncommand="document.getelementbyid('num').showtitle(true)"/> <button label="hide" oncommand="document.getelementbyid('num').showtitle(false)"/> xbl: <binding id="labeledbutton"> <content> <xul:label xbl:inherits="value=...

Adding more elements - Archive of obsolete content
uitem label="is"/> <menuitem label="is not"/> </menupopup> </menulist> <spacer style="width: 10px;"/> <textbox id="find-text" flex="1" style="min-width: 15em;"/> </hbox> <spacer style="height: 10px" flex="1"/> <hbox> now when the dialog is resized, the two buttons will move so that they are always along the bottom of the dialog. the first spacer adds extra spacing in between the title label and the search criteria elements. it might look nicer if there was a border around the search criteria. there are two ways to do this. we could use the css border property or we could use the groupbox element. this first method would require that we set the style on the box itself. we will use the latter method, however. a groupbox has the advantage that it draws a box with a nice beveled lo...

Advanced Rules - Archive of obsolete content
lled the predicate and the last part is called the object. as a triple element, it would be expressed as follows: <triple subject="a bookmark to mozilla.org" predicate="url" object="www.mozilla.org"/> this has been simplified a bit from the real thing. the predicate would normally include the namespace, and the subject would be the bookmark's resource id, not the bookmark's title as used here. in fact, the bookmark's title would be another triple in the datasource using the name predicate. you can replace the subject and object on the triple element with variable references, in which case values will be substituted for the variables. if no value is defined for a variable yet, the template builder will look up the value in the datasource and assign it to the variable. let's...

Box Objects - Archive of obsolete content
stored in the dom. retrieving position and size the box object provides six read only properties, x, y, screenx, screeny, width and height, for determining the currently displayed position and size of an element. all values returned are in pixels. x, y the x and y coordinates are referenced from the top left corner of the document in the window (that portion which excludes the window border and title bar) and refer to the top left corner of the element, including css padding. css margins and borders* are excluded. the top left corner of the document is that which is obtained from screen.mozinnerscreenx, screen.mozinnerscreeny screenx, screeny the screenx and screeny coordinates are referenced from the absolute top left corner of the screen (screen.top,screen.left) and refer to the top left c...

Creating a Window - Archive of obsolete content
dow tag -- in this case there are four. in the example, each attribute is placed on a separate line but they do not have to be. id="findfile-window" the id attribute is used as an identifier so that the window can be referred to by scripts. you will usually put an id attribute on all elements. the name can be anything you want although it should be something relevant. title="find files" the title attribute describes the text that would appear on the title bar of the window when it is displayed. in this case the text 'find files' will appear. orient="horizontal" the orient attribute specifies the arrangement of the items in the window. the value horizontal indicates that items should be placed horizontally across the window. you may also use the value vertical, which means that the items...

Introduction to RDF - Archive of obsolete content
declared so that the rdf elements are recognized properly. inside, the rdf element, you will place the data. to see some example rdf/xml files, look at those provided with mozilla. they have the extension rdf. rdf database let's take the example of a bookmarks list generated from rdf. a bookmarks list contains a set of records, each with a set of data associated with it, such as a url, a bookmark title and a visited date. think of the bookmarks as a database, which is stored as a large table with numerous fields. in the case of rdf however, the lists may be hierarchical as well. this is necessary so that we can have folders or categories of bookmarks. each of the fields in an rdf database is a resource, each with a name associated with it. the name is described by a uri. for example, a selection...

Localization - Archive of obsolete content
another locale. for example, the number might need to appear before the equivalent of 'bytes' instead of after. of course, this might need to be more complicated in order to display kb or mb as needed. the access keys and keyboard shortcuts have also been translated into entities because they will likely be different in a different locale. ...

Manifest Files - Archive of obsolete content
to the new contents.rdf file. this file is used to identify the application id, its name, author, version and so on. change the highlighted parts of the file above to your own information. the red text 'myapplication' should be the id of your application. you make this up, but typically, the id is similar to your application's name. replace the blue highlighted text above with your application's title and author. if the 'chrome:extension' field is true, the application is a mozilla firefox extension and it will show up in the extensions window of the browser. if false, it will not appear. save the contents.rdf and make sure it is in the directory you created in step 1. open the file <mozilla-directory>/chrome/installed-chrome.txt, where <mozilla-directory> is the directory where mozilla is i...

RDF Datasources - Archive of obsolete content
resource can be referred to using rdf:history as the datasource. the table below shows the resources (or fields) that you can retrieve from the history datasource. put the url values below where you want the value of the resource to be used. ...

XUL Questions and Answers - Archive of obsolete content
wser in xul? an example of tab browswer in xul how can i get uris on open tabs? using the following code sample, // get browsers object var browsers=document.getelementbyid('content').browsers; var numbrowsers=browsers.length; for (var i=0; numbrowsers>i; i++) { var thisuri=browsers[i].currenturi.spec; // do something with it. } the person can get the titles too using the .contenttitle tag. how to add and remove values to/from, set up inside a <prefwindow> container to handle the preference? <prefwindow> can contain any control, just like a regular window. some of them can be tied to a preference so that the preference is automatically updated as the control is manipulated. others, like <listbox>, cannot be so tied, but one can always write a script that updates preferences ...

browser - Archive of obsolete content
ge to go forward to in the session history and the forward button should be enabled. contentdocument type: document this read-only property contains the document object in the element. contentprincipal type: nsiprincipal this read-only property contains the principal for the content loaded in the browser, which provides security context information. contenttitle type: string this read-only property contains the title of the document object in the browser. contentvieweredit type: nsicontentvieweredit this read-only property contains the nsicontentvieweredit which handles clipboard operations on the document. contentviewerfile type: nsicontentviewerfile reference to the nsicontentviewerfile inter...

prefwindow - Archive of obsolete content
returns false it will not. ondialogdisclosure type: script code the code in this attribute is called when the "disclosure" button is pressed. ondialoghelp type: script code the code in this attribute is called when the "help" button is pressed. prefwindow.onload type: script code when a window finishes loading, it calls this event handler on the prefwindow element. title type: string the text to appear in the title bar of the window. type type: string set this attribute to child for preference dialogs that are child dialogs of a main preferences window. this ensures that the preferences are only saved when the main dialog is closed, if this is the appropriate behaviour for the platform. properties buttons type: comma-separated list of the v...

tabbrowser - Archive of obsolete content
if there is a page to go back to in the session history and the back button should be enabled. cangoforward type: boolean this read-only property is true if there is a page to go forward to in the session history and the forward button should be enabled. contentdocument type: document this read-only property contains the document object in the element. contenttitle type: string this read-only property contains the title of the document object in the browser. contentvieweredit type: nsicontentvieweredit this read-only property contains the nsicontentvieweredit which handles clipboard operations on the document. contentviewerfile type: nsicontentviewerfile reference to the nsicontentviewerfile interfa...

titlebar - Archive of obsolete content
properties inherited properties align, , allowevents, , boxobject, builder, , , , classname, , , , , collapsed, contextmenu, controllers, database, datasources, dir, , , flex, height, hidden, id, , , left, , maxheight, maxwidth, menu, minheight, minwidth, , , , , , , observes, ordinal, orient, , pack, , persist, , , , ref, resource, , , , , statustext, style, ,, too...

toolbarbutton - Archive of obsolete content
order that they appear in the xul source. vertical child elements of the element are placed under each other in a column in the order that they appear in the xul source. tabindex type: integer the tab order of the element. the tab order is the order in which the focus is moved when the user presses the "tab" key. elements with a higher tabindex are later in the tab sequence. title type: string this functionality only applies when toolbarbutton is used in the customize toolbar dialog. the text that is displayed as a button's label when it's in the customize toolbar palette. it overrides the value of label, which is used if title is not set. this does not affect the button's label when it is in a toolbar, which remains determined by the label attribute. type type:...

tree - Archive of obsolete content
xul for the tree: <?xml version="1.0"?> <?xml-stylesheet href="chrome://global/skin/" type="text/css"?> <?xml-stylesheet href="file://c:/main.css" type="text/css"?> <window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.i...

Windows and menus in XULRunner - Archive of obsolete content
eeper/there.is.only.xul"> <script src="main.js"/> ... </window> notice the references to css and dtd files. the css is used to apply formatting to elements, just as it would in html. the dtd is used to create entity references so strings for titles and labels are not stored directly in the xul file; this makes updating the text -- and localization of the application -- much easier. the window title is done this way in the above example. also notice the <script> element which is used to include the window’s javascript into the xul file. keeping css, dtd and javascript out of the xul file is considered a best practice. when you launch your xul application, you’ll notice that xulrunner gives your windows a default icon (top left corner on windows). you’ll most likely want to specify your...

calICalendarViewController - Archive of obsolete content
s.ns_error_no_interface; } return this; }, createnewevent: function (acalendar, astarttime, aendtime) { // if we're given both times, skip the dialog if (astarttime && aendtime && !astarttime.isdate && !aendtime.isdate) { var event = createevent(); event.startdate = astarttime; event.enddate = aendtime; event.title = "new event"; acalendar.additem(event, null); } else if (astarttime && astarttime.isdate) { var event = createevent(); event.startdate = astarttime; acalendar.additem(event, null); } else { createeventwithdialog(acalendar, astarttime, aendtime); } }, modifyoccurrence: function (aoccurrence, anewstarttime,...

Gecko Compatibility Handbook - Archive of obsolete content
ecko does not try to 'sniff' the mime type for a document in order to reduce the possibility of unsecure, dangerous content masquerading as as a safe mime type. use perl's head utitility to determine the actual mime type being used by the web server. correct any incorrect server mime types. (related article) stylesheet is not being recognized the presence of the title attribute in a link element that references an external stylesheet can cause the stylesheet may be causing the external stylesheet to be ignored. make sure that any stylesheet which should always be applied is persistent instead of preferred. (related article) connecting to a secure site fails, but connects in internet explorer the web server does not properly im...

Mozilla.dev.apps.firefox-2006-10-06 - Archive of obsolete content
ptember 30 - october 6, 2006 announcements vista compatibility lab mike schroepfer announced the current work being done testing mozilla products with vista. a wiki and irc channel have been created to track their progress. discussions firefox trunk and rc1 slowdown using tabs discussion regarding certain theme components (specifically alpha-transparency) creating a high cpu load on os/2. title case capitalization rules in firefox discussion regarding rules for capitalizing the first letter of firefox menu items in the ff ui. engineering student project - industry coach paul betts from ohio state university is looking for someone from mozilla to be his "industry coach" for engineering 494 - how great ideas turn into great products. mozilla is a great product afterall. reload vs. reload...

2006-10-06 - Archive of obsolete content
ptember 30 - october 6, 2006 announcements vista compatibility lab mike schroepfer announced the current work being done testing mozilla products with vista. a wiki and irc channel have been created to track their progress. discussions firefox trunk and rc1 slowdown using tabs discussion regarding certain theme components (specifically alpha-transparency) creating a high cpu load on os/2. title case capitalization rules in firefox discussion regarding rules for capitalizing the first letter of firefox menu items in the ff ui. engineering student project - industry coach paul betts from ohio state university is looking for someone from mozilla to be his "industry coach" for engineering 494 - how great ideas turn into great products. mozilla is a great product afterall. reload vs. reload...

Element - Archive of obsolete content
> (rss link element) m <managingeditor> (rss managing editor element) n <name> (rss name element) o p <pubdate> (rss published date element) q r <rating> (rss rating element) <rss> (rss's root "rss" element) s <skipdays> (rss skip days element) <skiphours> (rss skip hours element) <source> (rss source element) t <textinput> (rss text input element) <title> (rss title element) <ttl> (rss ttl element) u <url> (rss url element) v w <webmaster> (rss web master element) <width> (rss width element) x y z ...

Common Firefox theme issues and solutions - Archive of obsolete content
s a companion document to the amo editors guide common theme problems, which provides editors with "boilerplate" copy and paste review notes for common theme issues. this document was started on july 27, 2012 so it will take some time to completely fill in and some issues still need to have solutions written for them. operating system specific issues windows 7 windows 7 aero missing right-hand title bar buttons when tabs are on top and the menu bar is disabled, firefox is missing the min/max/restore/close button on the right side of the title bar. please see the following threads on mozillazine for solutions to this issue: http://forums.mozillazine.org/viewtopic.php?f=18&t=2131121 http://forums.mozillazine.org/viewtopic.php?f=18&t=1953371&start=60 windows 7 aero not going into full screen...

Browser Feature Detection - Archive of obsolete content
true true document.createelement() true true true document.createdocumentfragment() true true true document.createtextnode() true true true document.createcomment() true true true document.createattribute() true true true document.getelementsbytagname() true true true document.title true true true document.referrer true true true document.domain true true true document.url true true true document.body true true true document.images true true true document.applets true true true document.links true true true document.forms true t...

Object.observe() - Archive of obsolete content
e: <prototype>}] object.seal(obj); // [ // {name: 'foo', object: <obj>, type: 'reconfigure'}, // {name: 'bar', object: <obj>, type: 'reconfigure'}, // {object: <obj>, type: 'preventextensions'} // ] data binding // a user model var user = { id: 0, name: 'brendan eich', title: 'mr.' }; // create a greeting for the user function updategreeting() { user.greeting = 'hello, ' + user.title + ' ' + user.name + '!'; } updategreeting(); object.observe(user, function(changes) { changes.foreach(function(change) { // any time name or title change, update the greeting if (change.name === 'name' || change.name === 'title') { updategreeting(); } }); }); custom change type // a point on a 2d plane var point = {x: 0, y: 0, distance: 0}; function setposition(pt, x, y)...

Back to the Server: Server-Side JavaScript On The Rise - Archive of obsolete content
after the asset is retrieved and stored in a string, the proper namespaces are defined for this particular resource. the default namespace is defined along wi...

Common causes of memory leaks in extensions - Extensions
r stored as weak references. be careful with setinterval/settimeout using window.setinterval() or window.settimeout() can be problematic, too, when it comes to zombie compartments. consider the following example code that could be part of your browser.xul overlay: gbrowser.addeventlistener("domcontentloaded", function(evt) { var contentdoc = evt.originaltarget; var i = 0; // refresh the title once each second setinterval(function() { contentdoc.title = ++i; }, 1000); }, false); one would normally expect that the interval (or timer) would be destroyed as soon as the document unloads, in the same way that event listeners are automatically destroyed. however, while this is still true, the window.setinterval() in the example originates from the outer chrome window (browser.xul) a...

Game distribution - Game development
ith html5 gives you extra advantages, such as: multiplatform bliss the technology itself is multiplatform, so you can write the code once and target multiple devices. this can range from low-end smartphones or tablets, through laptops and desktop computers, to smart tvs, watches or even a fridge if it can handle a modern enough browser. you don't need to have separate teams to work on the same title targeting different platforms with only one code base to worry about. you can spend more time and money on promotion and monetization. instant updates you don't have to wait several days to have your game's code updated. if your user finds a bug, you can quickly fix it, update the system and refresh the game on your server to provide players with the updated code almost instantly. direct link d...

Game monetization - Game development
ut your game in a physical store in boxes, to earn decent money on selling your games for a fixed price you have to invest your time and money in marketing. only the best games will break even or earn more than they cost to make, and you still need a lot of luck for that. how much you charge for your game depends on the market, quality of your game and a lot of other small factors. an arcade ios title can be sold for 0.99 usd, but a longer rpg-style desktop game on steam can cost 20 usd; both prices are ok. you have to follow the market and do your own research — learning from your mistakes quickly is important. in-app purchases instead of having people pay for your game up front, you can offer a free game with in-app purchases (iaps.) in this case the game can be acquired without spending ...

2D maze game with device orientation - Game development
e preloadbar image: from 0% to 100%, updated on every frame. after all the assets are loaded, the mainmenu state is launched. mainmenu.js the mainmenu state shows the main menu of the game, where you can start playing by clicking the button. ...

Assessment: Accessibility troubleshooting - Learn web development
deas for improvements that would make the website more accessible? assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for accessibility troubleshooting". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with ...

Test your skills: CSS and JavaScript accessibility - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for css accessibility 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with...

HTML: A good basis for accessibility - Learn web development
t is better to write an empty text as a value for alt attribute (see empty alt attributes) or to just include them in the page as css background images. note: read images in html and responsive images for a lot more information about image implementation and best practices. if you do want to provide extra contextual information, you should put it in the text surrounding the image, or inside a title attribute, as shown above. in this case, most screen readers will read out the alt text, the title attribute, and the filename. in addition, browsers display title text as tooltips when moused over. let's have another quick look at the fourth method: <img src="dinosaur.png" aria-labelledby="dino-label"> <p id="dino-label">the mozilla red tyrannosaurus ... </p> in this case, we are not using ...

HTML: A good basis for accessibility - Learn web development
t is better to write an empty text as a value for alt attribute (see empty alt attributes) or to just include them in the page as css background images. note: read images in html and responsive images for a lot more information about image implementation and best practices. if you do want to provide extra contextual information, you should put it in the text surrounding the image, or inside a title attribute, as shown above. in this case, most screen readers will read out the alt text, the title attribute, and the filename. in addition, browsers display title text as tooltips when moused over. let's have another quick look at the fourth method: <img src="dinosaur.png" aria-labelledby="dino-label"> <p id="dino-label">the mozilla red tyrannosaurus ... </p> in this case, we are not using ...

Mobile accessibility - Learn web development
utting data tends to be more annoying for users than the equivalent experience on desktop computers. it is more convenient to type text into form inputs using a desktop or laptop keyboard than a touchscreen virtual keyboard or a tiny mobile physical keyboard. for this reason, it is worth trying to minimize the amount of typing needed. as an example, instead of getting users to fill out their job title each time using a regular text input, you could instead offer a <select> menu containing the most common options (which also helps with consistency in data entry), and offer an "other" option that displays a text field to type any outliers into. you can see a simple example of this idea in action in common-job-types.html (see the common jobs example live). it is also worth considering the use of ...

Test your skills: WAI-ARIA - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for wai-aria 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding...

A cool-looking box - Learn web development
ot shows an example of what the finished design could look like: assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for cool-looking box". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding prob...

Test your skills: The Cascade - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for cascade skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a c...

Creating fancy letterheaded paper - Learn web development
ot shows an example of what the finished design could look like: assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for creating fancy letterheaded paper". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone w...

Fundamental CSS comprehension - Learn web development
t shows an example of what the finished design should look like: assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for fundamental css comprehension". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with ...

Test your skills: Images and Form elements - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for images skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a co...

Organizing your CSS - Learn web development
bing this approach and promoting it means that even people who are not strictly following an oocss approach today will generally be reusing css in this way — it has entered our understanding as a good way to approach things in general. bem bem stands for block element modifier. in bem a block is a standalone entity such as a button, menu, or logo. an element is something like a list item or a title that is tied to the block it is in. a modifier is a flag on a block or element that changes the styling or behavior. you will be able to recognise code that uses bem due to the extensive use of dashes and underscores in the css classes. for example, look at the classes applied to this html from the page about bem naming conventions: <form class="form form--theme-xmas form--simple"> <input class...

Test your skills: Overflow - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for overflow skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a ...

Test your skills: The Box Model - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for box model skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want to be assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a...

Test your skills: sizing - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for sizing skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding p...

Test your skills: tables - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for tables skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding pro...

Test your skills: backgrounds and borders - Learn web development
to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum. add the "learning" tag to your post so we are able to more easily find it. your post should include: a descriptive title such as "assessment wanted for flexbox layout 1 skill test". details of what you would like us to do — for example what you have already tried, if you are stuck and need help,. a link to the example you want assessed or need help with, in an online editor. this is a good practice to get into — it's very hard to help someone with a coding problem if you can't see their code. a link to ...

Test your skills: values and units - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for values and units skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with ...

Test your skills: Writing Modes and Logical Properties - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for writing modes skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a c...

Test your skills: Flexbox - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for flexbox layout 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a ...

Test your skills: floats - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for float skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding prob...

Test Your Skills: Fundamental layout comprehension - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for fundamental layout comprehension". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone wi...

Test your skills: Grid Layout - Learn web development
if you'd like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for grid layout 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a cod...

Test your skills: Multicol - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for multicol skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding...

Test your skills: position - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for position skill test 1". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding...

Test your skills: Media Queries and Responsive Design - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for responsive web design assessment". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone wi...

Typesetting a community school homepage - Learn web development
ot shows an example of what the finished design could look like: assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for typesetting a community school homepage". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help som...

What HTML features promote accessibility? - Learn web development
li> <li><a href="anywhere.html" tabindex="2">anywhere</a></li> </ul> in this example (which is used purely as a demonstration—do not do this), tabbing would jump from “here” to “anywhere” to “there”. link titles if you have a link that isn’t self-descriptive, or the link destination could benefit from being explained in more detail, you can add information to a link using the title attribute. <p>i'm really bad at writing link text. <a href="inept.html" title="why i'm rubbish at writing link text: an explanation and an apology.">click here</a> to find out more.</p> access keys access keys provide easier navigation by assigning a keyboard shortcut to a link, which will usually gain focus when the user presses alt or ctrl + the access key. the exact key combination varies by...

What is the difference between webpage, website, web server, and search engine? - Learn web development
bing, yahoo, or duckduckgo. search engines are normally accessed through a web browser (e.g. you can perform search engine searches directly in the address bar of firefox, chrome, etc.) or through a web page (e.g. bing.com or duckduckgo.com). let's look at a simple analogy — a public library. this is what you would generally do when visiting a library: find a search index and look for the title of the book you want. make a note of the catalog number of the book. go to the particular section containing the book, find the right catalog number, and get the book. let's compare the library with a web server: the library is like a web server. it has several sections, which is similar to a web server hosting multiple websites. the different sections (science, math, history, etc.) in the...

How to structure a web form - Learn web development
s used so that sighted users and users of assistive technologies such as screen readers can learn what it means before they encounter a required element. while this helps inform users what an asterisk means, it can not be relied upon. a screen reader will speak an asterisk as "star" when encountered. when hovered by a sighted mouse user, "required" should appear, which is achieved by use of the title attribute. titles being read aloud depend on the screen reader's settings, so it is more reliable to also include the aria-label attribute, which is always read by screen readers. the above variants increase in effectiveness as you go through them: in the first example, the label is not read out at all with the input — you just get "edit text blank", plus the actual labels are read out separ...

Styling web forms - Learn web development
t : 498px; margin : 0 auto; padding: 1em; box-sizing: border-box; background : #fff url(background.jpg); /* we create our grid */ display : grid; grid-gap : 20px; grid-template-columns : repeat(2, 1fr); grid-template-rows : 10em 1em 1em 1em; } notice that we've used some css grid and flexbox to lay out the form. using this we can easily position our elements, including the title and all the form elements: h1 { font : 1em "typewriter", monospace; align-self : end; } #message { grid-row: 1 / 5; } #from, #reply { display: flex; } labels and controls now we can start working on the form elements themselves. first, let's ensure that the <label>s are given the right font: label { font : .8em "typewriter", sans-serif; } the text fields require some common rul...

Test your skills: Advanced styling - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for advanced form styling 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone ...

Test your skills: Basic controls - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for basic controls 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a ...

Test your skills: Form structure - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for form structure 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a ...

Test your skills: Form validation - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for form validation 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a...

Test your skills: HTML5 controls - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for html5 controls 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a ...

Test your skills: Other controls - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for other controls 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a ...

Test your skills: Styling basics - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for styling basics 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a ...

CSS basics - Learn web development
els on the right, bottom and left. the values set top, right, bottom, left, in that order. as with margin, you can use one, two, three, or four values, as documented in padding syntax. border: 5px solid black; this sets values for the width, style and color of the border. in this case, it's a five-pixel–wide, solid black border, on all sides of the body. positioning and styling the main page title h1 { margin: 0; padding: 20px 0; color: #00539f; text-shadow: 3px 3px 1px black; } you may have noticed there's a horrible gap at the top of the body. that happens because browsers apply default styling to the <h1> element (among others). that might seem like a bad idea, but the intent is to provide basic readability for unstyled pages. to eliminate the gap, we overwrite the browser's de...

Define terms with HTML - Learn web development
ially with <abbr>, so that screen readers read them appropriately and so that you can operate on all abbreviations uniformly. just as with any new keyword, you should define your abbreviations the first time they occur. <p> <dfn><abbr>html</abbr> (hypertext markup language)</dfn> is a description language used to structure documents on the web. </p> the html spec does indeed set aside the title attribute for expanding the abbreviation. however, this is not an acceptable alternative for providing an inline expansion. the contents of title are completely hidden from your users, unless they're using a mouse and they happen to hover over the abbreviation. the spec duly acknowledges this as well. improve accessibility <dfn> marks the keyword defined, and indicates that the current paragrap...

Marking up a letter - Learn web development
e of what the letter might look like after being marked up. assessment or further help if you would like your work assessed, or if you get stuck and want to ask for help: put your work in an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for marking up a letter". details of what you have already tried, and what you would like us to do (if you are stuck and need help, or if you want an assessment). a link to the example you want evaluated or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good habit to develop. it's very hard to help someone with a coding prob...

Test your skills: Advanced HTML text - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for advanced html text 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone wit...

Test your skills: HTML text basics - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for html text basics 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with ...

Test your skills: Links - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for links 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding pr...

Test your skills: HTML images - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for html image basics 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with...

Mozilla splash page - Learn web development
work into an online shareable editor such as codepen, jsfiddle, or glitch. glitch is probably better for this example, as it allows you upload assets like images, whereas some of the other tools don't. write a post asking for assessment and/or help at the mdn discourse forum. add the "learning" tag to your post so we are able to more easily find it. your post should include: a descriptive title such as "assessment wanted for mozilla splash page". details of what you would like us to do — for example what you have already tried, if you are stuck and need help,. a link to the example you want assessed or need help with, in an online editor. this is a good practice to get into — it's very hard to help someone with a coding problem if you can't see their code. a link to the actu...

Assessment: Structuring planet data - Learn web development
aders with their rows/columns is a lot easier than the other way. assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for structuring planet data". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a codi...

Image gallery - Learn web development
ts and tips you don't need to edit the html or css in any way. assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for image gallery". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding problem...

Test your skills: Conditionals - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for conditionals 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a co...

Test your skills: Events - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for events 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding p...

Test your skills: Functions - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for functions 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a codin...

Test your skills: Loops - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for loops 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding pr...

Silly story generator - Learn web development
l instances of 'love' to 'like'. remember, strings are immutable! assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for silly story generator". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding...

Test your skills: Arrays - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for variables 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a codin...

Test your skills: Math - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for math 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding pro...

Test your skills: Strings - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for strings 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding ...

Test your skills: variables - Learn web development
if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for variables 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding ...

Adding features to our bouncing balls demo - Learn web development
ime the evil circle eats a ball (causes it not to exist). assessment or further help if you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for adding bouncing balls features". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with...

Test your skills: JSON - Learn web development
restrictions using cors, but this is beyond the scope of what we are teaching here. assessment or further help you can practice these examples in the interactive editor above. if you would like your work assessed, or are stuck and want to ask for help: write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for json skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. your code. a link to the actual task or assessment page, so we can find the question you want help with. ...

Test your skills: Object-oriented JavaScript - Learn web development
you would like your work assessed, or are stuck and want to ask for help: put your work into an online shareable editor such as codepen, jsfiddle, or glitch. you can write the code yourself, or use the starting point files linked to in the above sections. write a post asking for assessment and/or help at the mdn discourse forum learning category. your post should include: a descriptive title such as "assessment wanted for oojs 1 skill test". details of what you have already tried, and what you would like us to do, e.g. if you are stuck and need help, or want an assessment. a link to the example you want assessed or need help with, in an online shareable editor (as mentioned in step 1 above). this is a good practice to get into — it's very hard to help someone with a coding pro...

Introduction to client-side frameworks - Learn web development
ions or focus management. in some cases, framework applications create accessibility barriers that do not exist for traditional websites. the biggest example of this is in client-side routing, as mentioned earlier. with traditional (server-side) routing, navigating the web has predictable results. the browser knows to set focus to the top of the page and assistive technologies will announce the title of the page. these things happen every time you navigate to a new page. with client-side routing, your browser is not loading new web pages, so it doesn't know that it should automatically adjust focus or announce a new page title. framework authors have devoted immense time and labor to writing javascript that recreates these features, and even then, no framework has done so perfectly. the upsh...

Getting started with React - Learn web development
hat will be read by your browser while you're developing the app; the most important of these is index.html. react injects your code into this file so that your browser can run it. there's some other markup that helps create-react-app function, so take care not to edit it unless you know what you're doing. you very much should change the text inside the <title> element in this file to reflect the title of your application. accurate page titles are important for accessibility! the public directory will also be published when you build and deploy a production version of your app. we won’t cover deployment in this tutorial, but you should be able to use a similar solution to that described in our deploying our app tutorial. the package.json file contains information about our project that node.

Starting our Svelte Todo list app - Learn web development
— this will contain our list of todos. create a new folder — src/components. note: you can put your components anywhere inside the src folder, but the components folder is a recognized convention to follow, allowing you to find your components easily. ...

Getting started with Svelte - Learn web development
on the left side of the screen you'll see the code of your components, and on the right you'll see the running output of your app. the bar above the code lets you create .svelte and .js files and rearrange them. to create a file inside a folder just specify the complete pathname, like this — components/mycomponent.svelte. the folder will be automatically created. above that bar you have the title of the repl. click on it to edit it. on the right side you have three tabs: the result tab shows your app output, and provides a console at the bottom. the js output tab lets you inspect the javascript code generated by svelte, and set compiler options. the css output tab shows the css generated by svelte. above the tabs, you'll find a toolbar that lets you enter full-screen mod...

Adding a new todo form: Vue events, methods, and models - Learn web development
input>, and a <button>. update your template as follows: <template> <form> <label for="new-todo-input"> what needs to be done? </label> <input type="text" id="new-todo-input" name="new-todo" autocomplete="off" /> <button type="submit"> add </button> </form> </template> so we now have a form component into which we can enter the title of a new todo item (which will become a label for the corresponding todoitem when it is eventually rendered). let's load this component into our app. go back to app.vue and add the following import statement just below the previous one, inside your <script> element: import todoform from './components/todoform'; you also need to register the new component in your app component — up...

Gecko info for Windows accessibility vendors
can use to get important information global to the document. if a given node's get_nodetype method returns nodetype_document, then you know you can queryinterface to an isimpledomdocument. the root accessible can also always be queryinterface'd to an isimpledomdocument. ...

Chrome registration
mozilla locates and reads the root chrome.manifest file for extensions and themes. note: with gecko 1.9.2 and older, mozilla reads chrome/*.manifest files from applications. starting with gecko 2.0, the root chrome.manifest is the only manifest used; you can add manifest commands to that file to load secondary manifests. ...

The Firefox codebase: CSS Guidelines
other tips assume ="true" in attribute selectors. example: use option[checked], not option[checked="true"]. avoid id selectors unless it is really the wanted goal, since ids have higher specificity and therefore are harder to override. using descendant selectors is good practice for performance when possible: for example: .autocomplete-item[selected] > .autocomplete-item-title would be more efficient than .autocomplete-item[selected] .autocomplete-item-title overriding css before overriding any css rules, check whether overriding is really needed. sometimes, when copy-pasting older code, it happens that the code in question contains unnecessary overrides. this could be because the css that it was overriding got removed in the meantime. in this case, simply drop...

mozbrowseropensearch
type read only domstring the type of event. bubbles read only boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property returns an anonymous javascript object with the following properties: title a domstring representing the title of the search engine. href a domstring representing url of the search engine. example var browser = document.queryselector("iframe"); browser.addeventlistener("mozbrowseropensearch", function( event ) { console.log("new search engine encountered: " + event.details.title); }); related events mozbrowserasyncscroll mozbrowserclose mozbrowsercontextmen...

mozbrowsershowmodalprompt
boolean whether the event normally bubbles or not. cancelable read only boolean whether the event is cancellable or not. details read only object a custom object. details the details property is an anonymous javascript object with the following properties: prompttype a domstring defining the type of the prompt. it can be alert, confirm, or prompt. title a domstring representing the title of the prompt. message a domstring representing the value passed to the window.alert(), window.confirm(), or window.prompt() methods within the browser <iframe>'s content. returnvalue a domstring representing the return value for the window.prompt() methods. this should be set by the embedder. unblock() a function to be called when the iframe is unblocked.

Browser API
l state changes within a browser <iframe>. mozbrowserselectionstatechanged sent when the text selected inside the browser <iframe> content changes. note that this is obsolete, and newer implementations use mozbrowsercaretstatechanged instead. mozbrowsershowmodalprompt sent when alert(), confirm(), or prompt() are called within a browser <iframe>. mozbrowsertitlechange sent when the document title changes within a browser <iframe>. mozbrowserusernameandpasswordrequired sent when an http authentification is requested. mozbrowseropensearch sent when a link to a search engine is found. mozbrowservisibilitychange sent when the visibility state of the current browser iframe <iframe> changes, for example due to a call to setvisible(). specifications this api isn't part of any official sp...

Embedding Tips
called with the dom node that the context applies, the dom event plus some flag combinations that assist in determining what menu to display (document, link, image, selected text etc.) how do i implement tool tips? make your chrome object implement the nsitooltiplistener interface. methods to hide or show the tool tips will automatically be called upon it when the user hovers over an item with title text. the contract id is defined here. for an example, see browserimpl.cpp in mfcembed and its simple cbrowsertooltip class implemented in mfc. how do i disable drag/drop support? when setting up your browser add a hook to the command manager which points to your nsiwebbrowserchrome implementation. this implementation should also implement nsiclipboarddragdrophooks. deny the drop by setting the...

Bootstrapping a new locale
browser/chrome/browser) $ edit ab-cd/browser/chrome/browser/aboutcerterror.dtd read the top of the file to get any context on how to translate contained in the notes written by the developers or l10n-drivers. localization notes will look like this: <!-- localization notes... --> after the localization notes, you will see a list of <!entity> strings like the following: <!entity certerror.pagetitle "untrusted connection"> you should go through each entity, translating the value in the parameters (e.g. untrusted connection in the example above), like so (example for polish): <!entity certerror.pagetitle "niezaufane połączenie"> once you have translated all the <!entity> strings in this file, you should save your work and open the next .dtd or .property file. you will need to go throu...

Mozilla Content Localized in Your Language
nology? currency currency and symbol. what are other widely used currency and symbols used in your country/language for paid apps. user interface elements titles should be brief and precise. localizers can assume that source content reaches 2/3 of the total available line space. this allows localization text to expand and not be truncated or resolved through ellipsis. title on the final page (meaning no more click through) should allow enough room to display full text. buttons capitalize the first letter of each word. limit to one or two words. use verbs that precisely describe the button's action. for example, "cancel", "clear history", "add email", "select all", etc. value selector lists capitalize the firs...

Localization and Plurals
#1 files - downloads # localization note (timepair): #1 time number; #2 time unit # example: 1 second; 11 seconds timepair=#1 #2 seconds=second;seconds minutes=minute;minutes hours=hour;hours downloads.js: components.utils.import("resource://gre/modules/pluralform.jsm"); let getstr = function(string) document.getelementbyid("strings").getstring(string); // get the correct plural form for the title let numdownloads = 3; let title = pluralform.get(numdownloads, getstr("downloadstitlefiles")); // put in the correct number of downloads print(title.replace("#1", numdownloads)); // get the correct plural form of seconds let timeleft = 55; let seconds = pluralform.get(timeleft, getstr("seconds")); // print the localized string for "55 seconds" print(getstr("timepair").replace("#1", timeleft).repl...

Localizing without a specialized tool
wser) $ edit l10n-mozilla-1.9.2/x-testing/browser/chrome/browser/aboutcerterror.dtd read the top of the file to get any context on how to translate contained in the notes written by the developers or l10n-drivers. localization notes will look like this: <!-- localization notes... --> after the localization notes, you will see a list of <!entity> strings like the following: <!entity certerror.pagetitle "untrusted connection"> you should go through each entity, translating the value in the parameters (e.g. untrusted connection in the example above), like so (example for polish): <!entity certerror.pagetitle "niezaufane połączenie"> once you have translated all the <!entity> strings in this file, you should save your work and open the next .dtd or .properties file. you will need to go throug...

Mozilla Style System Documentation
mozilla stores the output of the selector matching process in a lexicographic tree, the rule tree. this double tree (style context tree and rule tree) allows for sharing of style data, which allows the data to take up less memory and allows the data computation to take less time. for example, suppose we had the css stylesheet: /* rule 1 */ doc { display: block; text-indent: 1em; } /* rule 2 */ title { display: block; font-size: 3em; } /* rule 3 */ para { display: block; } /* rule 4 */ [class="emph"] { font-style: italic; } and the following document: <doc> <title>a few quotes</title> <para class="emph">benjamin franklin said that <quote>"a penny saved is a penny earned."</quote></para> <para>franklin d. roosevelt said that <quote>"we have nothing to fear but <span clas...

Activity Monitor, Battery Status Menu and top
dependent formula that only factors in cpu usage and wakeup frequency. in both cases "energy impact" often correlates poorly with actual power consumption and should be avoided in favour of direct measurements that have clear physical meanings. what does "average energy impact" measure? when the energy tab of activity monitor is first opened, the "average energy impact" column is empty and the title bar says "activity monitor (processing...)". after 5–10 seconds, the "average energy impact" column is populated with values and the title bar changes to "activity monitor (applications in last 8 hours)". if you have top open during those 5–10 seconds you'll see that systemstats is running and using a lot of cpu, and so presumably the measurements are obtained from it. systemstats is a progra...

mail.tabs.drawInTitlebar
starting in thunderbird 17.0, the tabs are drawn in the title bar. the old behavior can be restored by setting the preference mail.tabs.drawintitlebar to false. type:boolean default value: true exists by default: yes application support:thunderbird 17.0 status: active; last updated 2012-09-17 introduction: pushed to daily on 2012-08-08 bugs: bug 771816 values true (default) the tabs are drawn in the title bar of the mail program. false the tabs are drawn in a separate tab bar, and the title bar shows the title of the current tab (e.g. the subject of the currently selected mail). ...

Preference reference
een selected. the emitting of the oncopy, oncut and onpaste events are controlled by this preference. javascript.options.showinconsolethe preference javascript.options.showinconsole controls whether errors or warnings in chrome code are shown in the error console.javascript.options.stricttechnical review completed.mail.tabs.drawintitlebarstarting in thunderbird 17.0, the tabs are drawn in the title bar. the old behavior can be restored by setting the preference mail.tabs.drawintitlebar to false.nglayout.debug.disable xul fastloadthe preference nglayout.debug.disable_xul_fastload controls whether or not xul fastload is used.nglayout.debug.disable_xul_cacheto improve performance, mozilla caches chrome xul documents the first time they load for faster loading later. the effect is that the sourc...

L20n HTML Bindings
" class="btn-cancel" title="back to the homepage">cancel</a>. </p> the input element is not on the default whitelist but since it's present in the source html, it is also allowed in the translation. the value attribute is allowed on input elements, but type is not. similarly, href and onclick attributes are not allowed in translations and they are not inserted in the final dom. however, the title attribute is safe. it is important to note that applying translations doesn't replace dom elements, but only modifies their text nodes and their attributes. this makes it possible to use l20n in conjunction with mvc frameworks. when all dom nodes are localized, the document element will fire a documentlocalized event, which you can listen to: document.addeventlistener('documentlocalized', funct...

NSS reference
ting the ssl reference into the format described in the mdn style guide. if you are inclined to help with this migration, your help would be very much appreciated. the proposed chapters below are based on the chapters of the ssl reference and the categories of functions in nss public functions. should a particular page require the use of an underscore, please see the documentation for the title override extension. building and installing nss overview of an nss application based on "overview of an ssl application" in the ssl reference. getting started with nss based on "getting started with ssl" in the ssl reference. data types based on "selected ssl types and structures" in the ssl reference. nss initialization and shutdown nss_init nss_initreadwrite nss_nodb_init nss...

TPS History Lists
visits: required. an array of objects representing visits to the page, each object has the following properties: type: required. an integer value from one of the transition types listed at https://developer.mozilla.org/en/nsinavhistoryservice#constants. date: required. ...

TPS Tab Lists
if specified, only used during verify actions. profile: the name of the profile the tab belongs to. required for verify actions. ...

Gecko events
e keyboard focus. is supported: yes event_state_change an object's state has changed. is supported: yes states: state_focused, state_busy, xxx: event_location_change an object has changed location, shape, or size. is supported: no event_name_change an object's name property has changed. is supported: yes targets: table_cell - the cell of <xul:tree/>, any accessible for html element when @title or @alt attribute is changed. event_description_change an object's description property has changed. is supported: no event_value_change an object's value property has changed. is supported: yes event_help_change an object's help has changed. is supported: no event_defaction_change an object's default action has changed. is supported: no event_action_change an object's action has changed.

XUL Accessibility
ting to this element by the control attribute, if the label element is found then use value attribute or its content. ...

Using the Places history service
te. this will cause the transition type of the next visit of the url to be marked as "typed." nsinavhistoryservice.markpageasfollowedbookmark: called by the ui (implemented, but not yet called, see bug 409301) when the user selects a bookmark. this will cause the transition type of the next visit of the url to be marked as "bookmark." nsinavhistoryservice.setpageusertitle: sets the user-defined title for the page, which will override the actual page title when displayed in the ui. this is used for bookmark titles.this function may be removed if the bookmark service is changed. nsinavhistoryservice.setpagedetails: used to set all of the global bits associated with a url. it is designed for synchronizing or backup services. basic querying of the history system nsiglobalhistory2.isvisited: cal...

Mozilla internal string guide
general, you should use the concrete classes nsstring and nscstring for member variables. class foo { ... // these store utf-8 and utf-16 values respectively nscstring mlocalname; nsstring mtitle; }; note that the strings are declared directly in the class, not as pointers to strings. don't do this: class foo { public: foo() { mlocalname = new nscstring(); mtitle = new nsstring(); } ~foo() { delete mlocalname; delete mtitle; } private: // these store utf-8 and utf-16 values respectively nscstring* mlocalname; nsstring* mtitle; }; the above code may appear to save the cost of the string objects, but nsstring/nscstring are small objects - the overhead of the allocation outweighs the few bytes you'd save by keeping a pointer. another ...

Index
eir profile on a networked drive, query latency can be non-negligible 795 nsinavhistoryqueryoptions developing mozilla, extensions, interfaces, interfaces:scriptable, places, xpcom interface reference you can ask for the results to be pre-sorted. since the db has indices of many items, it can produce sorted results almost for free. note: re-sorting is slower, as is sorting by title or when you have a host name. 796 nsinavhistoryqueryresultnode developing mozilla, extensions, interfaces, places, xpcom, xpcom api reference returns the queries that build the node's children; only valid for result_type_query nodes. 797 nsinavhistoryresult developing mozilla, extensions, interfaces, places, xpcom, xpcom api reference places results use a ...

mozIPlaceInfo
or a places entry 1.0 66 introduced gecko 2.0 inherits from: nsisupports last changed in gecko 2.0 (firefox 4 / thunderbird 3.3 / seamonkey 2.1) attributes attribute type description frecency long read only: the frecency of the place. guid string read only: the globally unique id of the place. placeid long read only: the machine-local (internal) id of the place. title string read only: the title associated with the place. uri nsiuri read only: the uri of the place. visits mozivisitinfo[] read only: an array of mozivisitinfo objects for the place. see also moziasynchistory mozivisitinfo ...

mozIPlacesAutoComplete
first on word boundaries, and if we do not get enough results, then match anywhere in each searchable term. match_boundary 2 match on word boundaries in each searchable term. match_beginning 3 match only the beginning of each search term. behavior_history 1 << 0 search through history. behavior_bookmark 1 << 1 search though bookmarks. behavior_tag 1 << 2 search through tags. behavior_title 1 << 3 search the title of pages. behavior_url 1 << 4 search the url of pages. behavior_typed 1 << 5 search for typed pages. behavior_javascript 1 << 6 search javascript: urls. behavior_openpage 1 << 7 search for pages that have been marked as being opened, such as a tab in a tabbrowser. methods registeropenpage() mark a page as being currently open. note: pages will not be automatical...

mozIRegistry
it's not really about any "registry interface" so much as it's about how mozilla supports a more dynamic binding between interface clients and the code that actually provides the implementation of those interfaces. it happens that this objective requires storing information about which implementation to use in a place distinct from your source code. ...

nsIAbCard
meaddress2 astring homecity astring homestate astring homezipcode astring homecountry astring workaddress astring workaddress2 astring workcity astring workstate astring workzipcode astring workcountry astring jobtitle astring department astring company astring aimscreenname astring anniversaryyear astring anniversarymonth astring anniversaryday astring spousename astring familyname astring defaultaddress astring category astring ...

nsIAccessibleDocument
ocument. read only. note: renamed from document in gecko 2.0 iseditable boolean true if the document is live in an editor. false if the document is being displayed but not edited. if a <div> is contenteditable, then it has its own document, with iseditable == true. read only. obsolete since gecko 1.9 mimetype astring the mime type of the document. read only. title astring the title of the document, as specified in the document. read only. url astring the url of the document read only. window nsidomwindow the nsidomwindow that the document resides in. read only. windowhandle voidptr the window handle for the os window the document is being displayed in. for example, in windows you can static cast it to an hw...

nsIDOMChromeWindow
aultbutton); void restore(); void setcursor(in domstring cursor); attributes attribute type description browserdomwindow nsibrowserdomwindow the related nsibrowserdomwindow instance which provides access to yet another layer of utility functions by chrome script. it will be null for domwindows not corresponding to browsers. messagemanager nsichromeframemessagemanager read only. title domstring obsolete since gecko 1.9.1 windowstate unsigned short returns current window state, the value is one of state_* constants. read only. constants constant value description state_maximized 1 the window is maximized. state_minimized 2 the window is minimized. state_normal 3 the window is normal. state_fullscreen 4 the window is in full screen mode. methods beginwindowmov...

nsIDocShell
the storage object to add. addstate() do either a history.pushstate() or history.replacestate() operation, depending on the value of areplace. void addstate( in nsivariant adata, in domstring atitle, in domstring aurl, in boolean areplace ); parameters adata the state object to pass to the popstate event. it must be possible to serialise this in less than 640k characters. atitle gecko currently ignores this parameter. aurl the url associated with the new history entry. for instance, if the user tries to reload the page, then this is the url that will be reloaded. areplace whether to modify the current history entry instead of creating a new one. beginrestore() begin firing webprogresslistener notifications for restoring a page presentation. this metho...

nsIDroppedLinkHandler
n missing exception missing description droplink() given a drop event, determines the link being dragged. if a uri is returned the caller can, for instance, load it. if null is returned, there is no valid link to be dropped. astring droplink( in nsidomdragevent aevent, out astring aname, [optional] in boolean adisallowinherit ); parameters aevent a drop event. aname the link title if it exists, or an empty string otherwise. return value a uri, or null if there is no valid link to be dropped. exceptions thrown ns_error_dom_security_err error will be thrown and the event canceled if the receiving target should not load the uri for security reasons. this will occur if the source of the drag initiated a link for dragging that it itself cannot access. this prevents a sou...

nsIFeed
fetched on mondays would specify "monday" in this array. note: this field is rarely implemented. skiphours nsiarray an array of the hours of the day during which the feed should not be fetched. the hours are represented as integer values from 0 (midnight) to 23 (11:00 pm), and are always indicated using utc. note: this field is rarely implemented. subtitle nsifeedtextconstruct returns a subtitle for the feed, based on its description, subtitle, and appropriate extensions. textinput nsiwritablepropertybag2 information about a text box that can be displayed along with the feed by aggregators that support it, to allow the reader to send a response back to the source of the feed. note: this field is almost never used, and ...

nsIFeedContainer
id astring a string that identifies the feed or entry. not all feeds have these, but all major feed formats have ids for each entry. link nsiuri a uri containing the primary link for the feed or entry. links nsiarray an array of all links for a feed or entry. rights nsifeedtextconstruct the feed or entry's rights or license text. title nsifeedtextconstruct the feed or entry's title. keep in mind that some feeds have no title, and some use markup in their titles, so be cautious when decoding this attribute. updated astring a string containing the date the feed or entry was last updated, in rfc822 form. this string is parsable by javascript and mail code. methods normalize() synchronizes a container's fi...

nsIGlobalHistory2
the original uri which is redirected. atoplevel whether the uri is loaded in a top-level window. areferrer the uri of the referring page. isvisited() checks to see whether the given uri is in history. boolean isvisited( in nsiuri auri ); parameters auri the nsiuri of the page. return value true if a uri has been visited. setpagetitle() set the page title for the given uri. uris that are not already in global history will not be added. void setpagetitle( in nsiuri auri, in astring atitle ); parameters auri the nsiuri for which to set to the title. atitle the page title. see also nsiglobalhistory3 ...

nsIHTMLEditor
rs aproperty the property to set on the selection. aattribute the attribute of the property, if applicable. may be null. example: aproperty="font", aattribute="color" avalue if aattribute is not null, the value of the attribute. may be null. example: aproperty="font", aattribute="color", avalue="0x00ffff" setdocumenttitle() set the documents title. void setdocumenttitle( in astring atitle ); parameters atitle setinlineproperty() void setinlineproperty( in nsiatom aproperty, in astring aattribute, in astring avalue ); parameters aproperty aattribute avalue setparagraphformat() insert a block paragraph tag around selection. void setparagraphformat( in astring aparagraphformat ); parameters aparagraphformat "p", "h1" to "h6", "address", "pr...

nsIJumpListItem
he jump list item type. read only. constants constant value description jumplist_item_empty 0 empty list item. jumplist_item_separator 1 separator. jumplist_item_link 2 web link item. jumplist_item_shortcut 3 application shortcut. methods equals() compare this item to another. compares the type and other properties specific to this item's type: separator - type link - type, uri, title shortcut - type, handler application boolean equals( in nsijumplistitem item ); parameters item another nsijumplistitem to compare to. return value true if items are the same, otherwise false ...

nsIMsgFolder
id copydatadone(); setjunkscoreformessages() void setjunkscoreformessages(in nsisupportsarray amessages, in acstring ajunkscore); applyretentionsettings() void applyretentionsettings(); fetchmsgpreviewtext() get the beginning of the message bodies for the passed in keys and store them in the msg hdr property "preview". this is intended for new mail alerts, title tips on folders with new messages, and perhaps titletips/message preview in the thread pane. boolean fetchmsgpreviewtext([array, size_is (anumkeys)] in nsmsgkey akeystofetch, in unsigned long anumkeys, in boolean alocalonly, in nsiurllistener aurllistener); addkeywordstomessages() used to set/clear tags - w...

nsIMsgIncomingServer
astring getunicharattribute( in string name ); parameters name missing description return ...

nsIMsgWindow
to initialize the rootdocshell. methods displayhtmlinmessagepane() loads the specified html in the message pane. this is equivalent to calling loaduri on the nsiwebnavigation object with a data: url specifying the html. void displayhtmlinmessagepane(in astring title, in astring body, in boolean clearmsghdr); parameters title not used. body the html to display in the message pane. note that the html is wrapped in <html> and <body> tags for you. clearmsghdr whether or not the existing message pane and header should be cleared before the html is displayed. stopurls() this is equivalent to calling stop(nsiwebnavigation::stop_network) on the nsiwebnavigation object. void stopurls(); cl...

nsINavHistoryResultNode
he page visit occurred. for uris, this is the most recent time at which the uri was visited. even if you ask for all uris for a given date range long ago, this might contain today's date if the uri was visited today. for hosts, or other node types with children, this is the most recent access time for any of the children. for days, this is midnight on the morning of the day in question in utc. title autf8string title of the web page or of the node's grouping (day, host, folder, and so on.). read only. type unsigned long identifies the type of node. you can use queryinterface to access the corresponding specialized result node interface. read only. uri autf8string the uri of the resource represented by the node. for visits and urls, this is the url of the page. for folders and queries, thi...

nsINavHistoryService
n_redirect_temporary 6 this transition type is set when the transition was a temporary redirect. transition_download 7 this transition type is set when the transition is a download. transition_framed_link 8 this transition type is set when the user followed a link that loaded a page in a frame. methods getpagetitle() this method retrieves the original title of the page. astring getpagetitle( in nsiuri auri ); parameters auri the page whose title needs to be retrieved. return value returns the original title of the page. markpageasfollowedbookmark() this method is just like markpageastyped (in nsibrowserhistory, also implemented by the history service), but for bookmarks. it declares that the given uri is being opened as a result of foll...

nsITaskbarTabPreview
tead, call the nsiwintaskbar.createtaskbartabpreview(). method overview void ensureregistration(); violates the xpcom interface guidelines nativewindow gethwnd(); violates the xpcom interface guidelines void move(in nsitaskbartabpreview anext); attributes attribute type description icon imgicontainer the icon displayed next to the title in the preview. this is null by default. title domstring the title displayed above the thumbnail. by default, this is an empty string. methods violates the xpcom interface guidelines ensureregistration() used internally to ensure that the taskbar knows about this preview. if a preview is not registered, the api call to set its sibling (via the move() method) will fail...

nsITaskbarWindowPreview
nsiwintaskbar.gettaskbarwindowpreview() to get the taskbar preview for a specific window. window preview behavior by default, windows implements much of the behavior for applications in a standard way. this interface's primary purpose is to let gecko applications take control over parts of the preview; however, certain parts of the preview are not controlled using this interface. for example, the title and icon for each preview always match the title and icon of the corresponding window. if the enablecustomdrawing attribute is true, the controller you implement will start receiving calls to its nsitaskbarpreviewcontroller.drawpreview() and nsitaskbarpreviewcontroller.drawthumbnail() methods, as well as reads of its width, height, and thumbnailaccessratio attributes. by default, however, windows ...

nsIWebappsSupport
/ thunderbird 3.3 / seamonkey 2.1) method overview void installapplication(in wstring title, in wstring uri, in wstring iconuri, in wstring icondata); boolean isapplicationinstalled(in wstring uri); methods installapplication() this method installs a web application. void installapplication( in wstring title, in wstring uri, in wstring iconuri, in wstring icondata ); parameters title the user-friendly name of the application. uri the uri of the web application. iconuri the uri of icon of the web application. icondata a base64 encoded representation of the application's icon. isapplicationinstalled() checks is a web application is already installed. boolean isapplicationinstalled( in wstring uri ); parameters uri the uri of the web application. return value true if the we...

nsMsgSearchAttrib
gsearchattribvalue phonenumber = 23; const nsmsgsearchattribvalue workphone = 24; const nsmsgsearchattribvalue homephone = 25; const nsmsgsearchattribvalue fax = 26; const nsmsgsearchattribvalue pager = 27; const nsmsgsearchattribvalue mobile = 28; const nsmsgsearchattribvalue city = 29; const nsmsgsearchattribvalue street = 30; const nsmsgsearchattribvalue title = 31; const nsmsgsearchattribvalue organization = 32; const nsmsgsearchattribvalue department = 33; // 34 - 43, reserved for ab / ldap; const nsmsgsearchattribvalue hasattachmentstatus = 44; const nsmsgsearchattribvalue junkstatus = 45; const nsmsgsearchattribvalue junkpercent = 46; const nsmsgsearchattribvalue junkscoreorigin = 47; const nsmsgsearchattrib...

nsPIPromptService
d text field. this is also used for the result of the dialog. ebutton0text the value is 8. this is the label of the first button on the dialog. ebutton1text the value is 9. this is the label of the second button on the dialog. ebutton2text the value is 10. this is the label of the third button on the dialog. ebutton3text the value is 11. this is the label of the forth button on the dialog. edialogtitle the value is 12. this is the title of the dialog. eopeningsound obsolete since gecko 1.9.2 the value is 13. this is the system sound name which should be played when the dialog is shown. see also nsisound.playsystemsound(). this is obsolete on gecko 1.9.2 and later. you should use esoundeventid instead. the indexes for getint() and setint() are: ebuttonpressed the value is 0. this is used for t...

LDAP Support
cellularnumber mobile cellularnumber cellphone cellularnumber carphone workaddress postofficebox workaddress streetaddress workcity l workcity locality workstate st workstate region workzipcode postalcode workzipcode zip workcountry countryname jobtitle title department ou department orgunit department department department departmentnumber company o company company workcountry countryname _aimscreenname nscpaimscreenname webpage1 workurl webpage2 homeurl birthyear birthyear custom1 custom1 cu...

Using tab-modal prompts
pt = promptfact.getprompt(window, components.interfaces.nsiprompt); var promptbag = prompt.queryinterface(components.interfaces.nsiwritablepropertybag2); promptbag.setpropertyasbool('allowtabmodal', true); var check = {value: false}; //initial state of checkbox, however if no text is supplied the checkbox is not shown var input = {value: 'pre filled value'}; var ok = prompt.prompt.apply(null, ['title - but not shown in tab modal', 'text goes here', input, 'check text, if no text, checkbox is not shown', check]); //this here is just an alert, showing the values of the prompt prompt.alert.apply(null, ['title not shown in modal', 'user clicked ok: ' + ok + '\n' + 'checked: ' + check.value + '\ninput value: ' + input.value]); note: because the prompts are shown in a tab, if the tab is closed whi...

Working with windows in chrome code
ypassing xpcnativewrapper to work with content javascript directly can lead to security problems. see interaction between privileged and non-privileged pages if you need to interact with the content page. the content shortcut in case of <browser type="content-primary" />, you can use the content shortcut property to accesss the window object of the content document. for example: // alerts the title of the document displayed in the content-primary widget alert(content.document.title); for example, you can use content.document in a browser.xul overlay to access the web page in the selected tab in a firefox window. some examples use _content instead of content. the former has been deprecated for a while, and you should use content in the new code. accessing a document in the sidebar firefo...

Using js-ctypes
rary/mac/documentation/corefoundation/reference/cfusernotificationref/index.html#//apple_ref/c/func/cfusernotificationdisplaynotice * sint32 cfusernotificationdisplaynotice ( * cftimeinterval timeout, * cfoptionflags flags, * cfurlref iconurl, * cfurlref soundurl, * cfurlref localizationurl, * cfstringref alertheader, * cfstringref alertmessage, * cfstringref defaultbuttontitle * ); */ var cfusernotificationdisplaynotice = libcf.declare("cfusernotificationdisplaynotice", ctypes.default_abi, sint32, // return cftimeinterval, // timeout cfoptionflags, // flags cfurlref, // iconurl cfurlref, // soundurl cfurlref, // localizationurl cfstringref, // alertheader cfstringref, // alertmessage cfstringref // defaultbuttontitle ); /* https://developer.ap...

Mozilla
there are a lot of different memory allocators in the mozilla source tree. this article looks over some of them and tries to sort out which should be used under what circumstances. chrome registration chrome is the set of user interface elements of the application window that are outside the window's content area. toolbars, menu bars, progress bars, and window title bars are all examples of elements that are typically part of the chrome. command line options command line options are used to specify various startup options for mozilla applications.this page describes the commonly used options and how to use them. you can open the command line interface by pressing shift + f2. con...

Accessibility Inspector - Firefox Developer Tools
l in the corresponding <a> element's href. domnode — the type of dom node that the item in the accessibility tree represents. you can click on the "target" icon that comes after it to select the node in the page inspector. hovering over the "target" icon highlights the dom node in the page content. description — any further description provided on the element, usually by the content of a title attribute. keyboardshortcut — any keyboard shortcut that is available to activate the element, as specified in an accesskey attribute. note that this works correctly as of firefox 62 (bug 1467381). childcount — the number of child items the current item has in the accessibility tree hierarchy. indexinparent — an index value indicating what number child the item is, inside its parent. if t...

DOM Inspector internals - Firefox Developer Tools
se features. the other edit menu items are also used in several viewers' context menus. for that reason, only those menuitems' ids are referenced here, and the complete definitions are imported from editingoverlay.xul. viewers which include one or more of these menuitems in their context menus follow the same practice. the tooltip used for the inspect menus—the one used to show a document's title (if any) and its uri for a given menuitem—is also defined here. commandoverlay.xul the popupoverlay.xul-provided menuitems that delegate to external command elements have their commands defined here. keysetoverlay.xul some popupoverlay.xul-provided menuitems have their keys defined here. as of this writing, all of the keys that correspond to edit menu items live in editingoverlay for no go...

Introduction to DOM Inspector - Firefox Developer Tools
sed from the file menu , and it will contain the list of currently loaded chrome windows and subdocuments. a browser window and the dom inspector are likely be already open and displayed in this list. the dom inspector keeps track of all the windows that are open, so to inspect the dom of a particular window in the dom inspector, simply access that window as you would normally and then choose its title from this dynamically updated menulist. inspecting arbitrary urls you may also inspect the dom of arbitrary urls by using the inspect a url menuitem in the file menu, or by just entering a url into the dom inspector's address bar and clicking inspect or pressing enter. for example, you can enter http://www.mozilla.org in the address bar and see the dom structure of the mozilla.org home page. ...

about:debugging - Firefox Developer Tools
che recipe, nightly home, and about nightly. to debug the contents of one of these tabs, click the inspect button next to its title. when you do, the developer tools open in a new tab. above the usual list of tools, you can see information about the device you are connected to, including the fact that you are connected (in this example) via usb, to firefox preview, on a pixel 2, as well as the title of the page that you are debugging, and the address of the page. starting in firefox 78, the url bar is editable, so that you can change the url used by the browser on the remote device, by typing in firefox for desktop. you can also reload the page by clicking the reload button next to the url bar, and (starting 79), navigate backward or forward in the browsing history with the back and forward ...

ContentIndex.getAll() - Web APIs
omise that resolves with an iterable list of content index entries. syntax var indexedcontent = contentindex.getall(); parameters this method receives no parameters. return value returns a promise that resolves with an array of contentdescription items. contentdescription each item returned is an object containing the following data: id: a unique string identifier. title: a string title for the item. used in user-visible lists of content. title: a string title of the item. used in user-visible lists of content. description: a string description of the item. used in user-visible lists of content. url: a string containing the url of the corresponding html document. needs to be under the scope of the current service worker. category: optional a string defining the category o...

DataTransferItem.webkitGetAsEntry() - Web APIs
drag files and/or directories to the box below!</p> <div id="dropzone"> <div id="boxtitle"> drop files here </div> </div> <h2>directory tree:</h2> <ul id="listing"> </ul> css content the styles used by the example are shown here. #dropzone { text-align: center; width: 300px; height: 100px; margin: 10px; padding: 10px; border: 4px dashed red; border-radius: 10px; } #boxtitle { display: table-cell; vertical-align: middle; text-align: center; color: black; font: bold 2em "arial", sans-serif; width: 300px; height: 100px; } body { font: 14px "arial", sans-serif; } javascript content first, let's look at the recursive scanfiles() function. this function takes as input a filesystementry representing an entry in the file system to be scanned and processed ...

Document - Web APIs
ument. document.domain gets/sets the domain of the current document. document.lastmodifiedread only returns the date on which the document was last modified. document.locationread only returns the uri of the current document. document.readystateread only returns loading status of the document. document.referrerread only returns the uri of the page that linked to this page. document.title sets or gets the title of the current document. document.urlread only returns the document location as a string. properties included from documentorshadowroot the document interface includes the following properties defined on the documentorshadowroot mixin. note that this is currently only implemented by chrome; other browsers still implement them directly on the document interface. doc...

DocumentOrShadowRoot.styleSheets - Web APIs
the stylesheets read-only property of the documentorshadowroot interface returns a stylesheetlist of cssstylesheet objects, for stylesheets explicitly linked into or embedded in a document. examples function getstylesheet(unique_title) { for (var i=0; i<document.stylesheets.length; i++) { var sheet = document.stylesheets[i]; if (sheet.title == unique_title) { return sheet; } } } notes the returned list is ordered as follows: stylesheets retrieved from <link> headers are placed first, sorted in header order. stylesheets retrieved from the dom are placed after, sorted in tree order. specifications specification status comment shadow domthe definition of 'documentorshadowroot' in that specification. obsolete initial definiti...

FileReader.readAsDataURL() - Web APIs
for a full compatibility code you can see our crossbrowser possible solution for image...

FileSystemDirectoryReader.readEntries() - Web APIs
drag files and/or directories to the box below!</p> <div id="dropzone"> <div id="boxtitle"> drop files here </div> </div> <h2>directory tree:</h2> <ul id="listing"> </ul> css content the styles used by the example are shown here. #dropzone { text-align: center; width: 300px; height: 100px; margin: 10px; padding: 10px; border: 4px dashed red; border-radius: 10px; } #boxtitle { display: table-cell; vertical-align: middle; text-align: center; color: black; font: bold 2em "arial", sans-serif; width: 300px; height: 100px; } body { font: 14px "arial", sans-serif; } javascript content first, let's look at the recursive scanfiles() function. this function takes as input a filesystementry representing an entry in the file system to be scanned and processed ...

accessKeyLabel - Web APIs
the htmlelement.accesskeylabel read-only property returns a string that represents the element's assigned access key (if any); otherwise it returns an empty string. syntax label = element.accesskeylabel example javascript var node = document.getelementbyid('btn1'); if (node.accesskeylabel) { node.title += ' [' + node.accesskeylabel + ']'; } else { node.title += ' [' + node.accesskey + ']'; } node.onclick = function () { var p = document.createelement('p'); p.textcontent = 'clicked!'; node.parentnode.appendchild(p); }; html <button accesskey="h" title="caption" id="btn1">hover me</button> result specifications specification status comment html living standardthe definition of 'htmlelement.accesskeylabel' in that specification. living stand...

HTMLElement.dir - Web APIs
e htmlelement.dir property gets or sets the text writing directionality of the content of the current element. the text writing directionality of an element is which direction that text goes (for support of different language systems). arabic languages and hebrew are typical languages using the rtl directionality. an image can have its dir property set to "rtl" in which case the html attributes title and alt will be formatted and defined as "rtl". when a table has its dir set to "rtl", the column order is arranged from right to left. when an element has its dir set to "auto", the direction of the element is determined based on its first strong directionality character, or default to the directionality of its parent element. browsers might allow users to change the directionality of <input>...

HTMLElement - Web APIs
ction… htmlelement.spellcheck is a boolean that controls spell-checking. it is present on all html elements, though it doesn't have an effect on all of them. htmlelement.style is a cssstyledeclaration, an object representing the declarations of an element's style attributes. htmlorforeignelement.tabindex is a long representing the position of the element in the tabbing order. htmlelement.title is a domstring containing the text that appears in a popup box when mouse is over the element. htmlelement.translate is a boolean representing the translation. event handlers most event handler properties, of the form onxyz, are defined on the documentandelementeventhandlers, globaleventhandlers or toucheventhandlers interfaces and implemented by htmlelement. in addition, the following han...

HTMLImageElement.longDesc - Web APIs
syntax descurl = htmlimageelement.longdesc; htmlimageelement.longdesc = descurl; value a domstring which may be either an empty string (indicating that no long description is available) or the url of a file containing a long form description of the image's contents. ...

HTMLInputElement - Web APIs
minlength long: returns / sets the element's minlength attribute, containing the minimum number of characters (in unicode code points) that the value can have. (if you set this to a negative number, an exception will be thrown.) pattern string: returns / sets the element's pattern attribute, containing a regular expression that the control's value is checked against. use the title attribute to describe the pattern to help the user. this attribute applies when the value of the type attribute is text, search, tel, url or email; otherwise it is ignored. placeholder string: returns / sets the element's placeholder attribute, containing a hint to the user of what can be entered in the control. the placeholder text must not contain carriage returns or line-feeds. this...

HTMLTitleElement - Web APIs
this element inherits all of the properties and methods of the htmlelement interface. ...

HTMLTrackElement - Web APIs
descriptions, chapters, or metadata. htmltrackelement.src is a domstring that reflects the src html attribute, indicating the address of the text track data. htmltrackelement.srclang is a domstring that reflects the srclang html attribute, indicating the language of the text track data. htmltrackelement.label is a domstring that reflects the label html attribute, indicating a user-readable title for the track. htmltrackelement.default a boolean reflecting the default attribute, indicating that the track is to be enabled if the user's preferences do not indicate that another track would be more appropriate. htmltrackelement.readystate read only returns an unsigned short that show the readiness state of the track: constant value description none 0...

Recommended Drag Types - Web APIs
ww.mozilla.org"); as usual, set the text/plain type last, as a fallback for the text/uri-list type. note: the url type is uri-list with an i, not an l. to drag multiple links, separate each link inside the text/uri-list data with a crlf linebreak. lines that begin with a number sign (#) are comments, and should not be considered urls. you can use comments to indicate the purpose of a url, the title associated with a url, or other data. the text/plain fallback for multiple links should include all urls, but no comments. for example, this sample text/uri-list data contains two links and a comment: http://www.mozilla.org #a second link http://www.example.com when retrieving a dropped link, ensure you handle when multiple links are dragged, including any comments. for convenience, the spe...

History.replaceState() - Web APIs
in the method parameters. this method is particularly useful when you want to update the state object or url of the current history entry in response to some user action. syntax history.replacestate(stateobj, title, [url]) parameters stateobj the state object is a javascript object which is associated with the history entry passed to the replacestate method. the state object can be null. title most browsers currently ignore this parameter, although they may use it in the future. passing the empty string here should be safe against future changes to the method. alternatively, you could pass a short title for the state. url optional the url of the history entry. the new url must be of the same origin as the current url; otherwise replacestate throws an exception. examples suppose ht...

IDBCursor.advance() - Web APIs
recommendation indexed database api draftthe definition of 'ad...

IDBCursor.continue() - Web APIs
recommendation indexed database api draftthe definition of 'continue()' ...

IDBCursor.direction - Web APIs
recommendation ...

IDBCursor.request - Web APIs
recommendation initial definition...

IDBCursor.source - Web APIs
recommendation indexed database api draftthe ...

IDBCursor - Web APIs
recommendation initial definition indexed database api draftthe definition of 'cur...

IDBCursorWithValue.value - Web APIs
recommendation indexed database api draftthe d...

IDBCursorWithValue - Web APIs
recommendation indexed database api draftthe definition of 'idbcurso...

IDBDatabase: error event - Web APIs
base when a request returns an error and the event bubbles up to the connection object. ...

IDBIndex.count() - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.get() - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.getKey() - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.isAutoLocale - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.keyPath - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.locale - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.multiEntry - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.name - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.objectStore - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.openCursor() - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex.unique - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBIndex - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBLocaleAwareKeyRange - Web APIs
{ var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '&lt;td&gt;' + cursor.value.id + '&lt;/td&gt;' + '&lt;td&gt;' + cursor.value.lname + '&lt;/td&gt;' + '&lt;td&gt;' + cursor.value.fname + '&lt;/td&gt;' + '&lt;td&gt;' + cursor.value.jtitle + '&lt;/td&gt;' + '&lt;td&gt;' + cursor.value.company + '&lt;/td&gt;' + '&lt;td&gt;' + cursor.value.email + '&lt;/td&gt;' + '&lt;td&gt;' + cursor.value.phone + '&lt;/td&gt;' + '&lt;td&gt;' + cursor.value.age + '&lt;/td&gt;'; tableentry.appendchild(tablerow); cursor.continue(); ...

IDBObjectStore.index() - Web APIs
.opencursor().onsuccess = function(event) { var cursor = event.target.result; if(cursor) { var tablerow = document.createelement('tr'); tablerow.innerhtml = '<td>' + cursor.value.id + '</td>' + '<td>' + cursor.value.lname + '</td>' + '<td>' + cursor.value.fname + '</td>' + '<td>' + cursor.value.jtitle + '</td>' + '<td>' + cursor.value.company + '</td>' + '<td>' + cursor.value.email + '</td>' + '<td>' + cursor.value.phone + '</td>' + '<td>' + cursor.value.age + '</td>'; tableentry.appendchild(tablerow); cursor.continue(); } else { console.log('entries all displayed.'...

IDBRequest: error event - Web APIs
the error handler is executed when an error caused a request to fail. ...

IDBTransaction: error event - Web APIs
ion when a request returns an error and the event bubbles up to the transaction object. ...

Key Values - Web APIs
gdk_key_splitscreen (0x1008ff7d) qt::key_splitscreen (0x010000ed) "stbinput" [3] cycles among input modes on an external set-top box (stb). keycode_stb_input (180) "stbpower" [3] toggles on and off an external stb. keycode_stb_power (179) "subtitle" toggles the display of subtitles on and off if they're available. vk_subtitle gdk_key_subtitle (0x1008ff9a) keycode_captions (175) "teletext" toggles display of teletext, if available. vk_teletext keycode_tv_teletext (233) "videomodenext" [3] cycles through the available video modes. vk_video_mode_next gdk_key_next_vmode (0x1008fe22) "wink" causes the device to identify itself in some fashion, such as...

MediaMetadata.MediaMetadata() - Web APIs
artist: the name of the artist, group, creator, etc. of the media to be played. album: the name of the album, or collection, containing the media to be played. artwork: an array of images associated with the playing media. ...

Navigator.registerContentHandler() - Web APIs
le handlers for content of a particular mime type. note: web sites may only register content handlers for themselves. for security reasons, it's not possible for an extension or web site to register content handlers targeting other sites. syntax navigator.registercontenthandler(mimetype, uri, title); mimetype is the desired mime type as a string. uri is the uri to the handler as a string. title is the title of the handler presented to the user as a string. example navigator.registercontenthandler( "application/vnd.mozilla.maybe.feed", "http://www.example.tld/?foo=%s", "my feed reader" ); notes for firefox 2 and above, only the application/vnd.mozilla.maybe.feed, application/atom+xml, and application/rss+xml mime types are supported. all values have the same effect, and t...

Navigator.share() - Web APIs
the web share api invokes the native sharing mechanism of the device. syntax var sharepromise = navigator.share(data); parameters data an object containing data to share. at least one of the following fields must be specified. available options are: url: a usvstring representing a url to be shared. text: a usvstring representing text to be shared. title: a usvstring representing the title to be shared. files: a " frozenarray" representing the array of file to be shared. return value a promise that will be fulfilled once a user has completed a share action (usually the user has chosen an application to share to). it will reject immediately if the data parameter is not correctly specified, and will also reject if the user cancels sharing. examples in our web share test (see ...

Notification.icon - Web APIs
notification interface contains the url of an icon to be displayed as part of the notification, as specified in the icon option of the notification() constructor. syntax var icon = notification.icon; value a usvstring. examples in our to-do list app (view the app running live), we use the notification() constructor to fire a notification, passing it arguments to specify the body, icon and title we want. var notification = new notification('to do list', { body: text, icon: img }); specifications specification status comment notifications apithe definition of 'icon' in that specification. living standard living standard ...

Notification - Web APIs
active until the user clicks or dismisses it, rather than closing automatically. notification.silent read only specifies whether the notification should be silent — i.e., no sounds or vibrations should be issued, regardless of the device settings. notification.timestamp read only specifies the time at which a notification is created or applicable (past, present, or future). notification.title read only the title of the notification as specified in the first parameter of the constructor. notification.vibrate read only specifies a vibration pattern for devices with vibration hardware to emit. event handlers notification.onclick a handler for the click event. it is triggered each time the user clicks on the notification. notification.onclose a handler for the close event. it ...

NotificationAction - Web APIs
functionality vary across platforms but generally they provide a way to asynchronously show actions to the user in a notification. properties instance properties these properties are available only on instances of the notification object. notificationaction.action read only the name of the action, which can be used to identify the clicked action similar to input names. notificationaction.title read only the string describing the action that is displayed to the user. notificationaction.icon read only the url of the image used to represent the notification when there is not enough space to display the notification itself. example notifications can fire notificationclick events on the serviceworkerglobalscope. here a service worker shows a notification with a single "archive" acti...

Notifications API - Web APIs
o allow notifications from this origin, or block them. once a choice has been made, the setting will generally persist for the current session. note: as of firefox 44, the permissions for notifications and push have been merged. if permission is granted for notifications, push will also be enabled. next, a new notification is created using the notification() constructor. this must be passed a title argument, and can optionally be passed an options object to specify options, such as text direction, body text, icon to display, notification sound to play, and more. in addition, the notifications api spec specifies a number of additions to the serviceworker api, to allow service workers to fire notifications. note: to find out more about using notifications in your own app, read using the not...

Using the Payment Request API - Web APIs
s checking whether users can make payments is always useful. here's a couple of related techniques. customizing the payment button one useful technique to employ is customizing the payment request button depending on whether users can make payments. in the following snippet we do just this — depending on whether the user can make a fast payment or needs to add payment credentials first, the title of the checkout button changes between "fast checkout with w3c" and "setup w3c checkout". in both cases, the checkout button calls paymentrequest.show(). const checkoutbutton = document.getelementbyid('checkout-button'); checkoutbutton.innertext = "loading..."; if (window.paymentrequest) { let request = new paymentrequest(buildsupportedpaymentmethodnames(), buildshoppingcartdetails()); ...

RTCDataChannel.onerror - Web APIs
the example below, a data channel is established, and an onerror handler is added to it. the error handler passes information about the error to a ui library's alert box function to present an error message to the user. let pc = new rtcpeerconnection(); let dc = pc.createdatachannel("playercontrol"); dc.onerror = function(event) { myuilibrary.doalertbox({ 'network error', // alert title 'the error "' + event.message + '" occurred while handling player control network messages.', event.filename, event.lineno, event.colno }); } /* ... */ specifications specification status comment webrtc 1.0: real-time communication between browsersthe definition of 'rtcdatachannel.onerror' in that specification. candidate recommendati...

SVGStyleElement - Web APIs
on an attempt to change the value of a read-only attribute. this restriction was removed in svg 2. svgstyleelement.media a domstring corresponding to the media attribute of the given element. svg 1.1 defined that a domexception is raised with code no_modification_allowed_err on an attempt to change the value of a read-only attribute. this restriction was removed in svg 2. svgstyleelement.title a domstring corresponding to the title attribute of the given element. svg 1.1 defined that a domexception is raised with code no_modification_allowed_err on an attempt to change the value of a read-only attribute. this restriction was removed in svg 2. methods this interface doesn't implement any specific methods, but inherits methods from its parent interface, svgelement and implements me...

StyleSheet - Web APIs
esenting the location of the stylesheet. stylesheet.media read only returns a medialist representing the intended destination medium for style information. stylesheet.ownernode read only returns a node associating this style sheet with the current document. stylesheet.parentstylesheet read only returns a stylesheet including this one, if any; returns null if there aren't any. stylesheet.title read only returns a domstring representing the advisory title of the current style sheet. stylesheet.typeread only returns a domstring representing the style sheet language for this style sheet. specifications specification status comment css object model (cssom)the definition of 'stylesheet' in that specification. working draft no change from document object ...

HTML in XMLHttpRequest - Web APIs
ed for detecting html parsing support: function detecthtmlinxhr(callback) { if (!window.xmlhttprequest) { window.settimeout(function() { callback(false); }, 0); return; } var done = false; var xhr = new window.xmlhttprequest(); xhr.onreadystatechange = function() { if (this.readystate == 4 && !done) { done = true; callback(!!(this.responsexml && this.responsexml.title && this.responsexml.title == "&&<")); } } xhr.onabort = xhr.onerror = function() { if (!done) { done = true; callback(false); } } try { xhr.open("get", "detect.html"); xhr.responsetype = "document"; xhr.send(); } catch (e) { window.settimeout(function() { if (!done) { done = true; callback(false); } }, 0); } } th...

XSLT Basic Example - Web APIs
lesheet? processing instruction, it links to the xslt stylesheet (example.xsl) via its href attribute. an xslt stylesheet starts with the xsl:stylesheet element, which contains all the templates used to create the final output. the example in figure 1 has two templates - one that matches the root node and one that matches author nodes. the template that matches the root node outputs the article's title and then says to process all templates (via apply-templates) that match author nodes which are children of the authors node. figure 1 : simple xslt example xml document (example.xml) : <?xml version="1.0"?> <?xml-stylesheet type="text/xsl" href="example.xsl"?> <article> <title>my article</title> <authors> <author>mr. foo</author> <author>mr. bar</author> </authors> <body>this is ...

ARIA live regions - Accessibility
planet from the sun and the only object in the universe known to harbor life.' }, mars: { title: "mars", description: 'mars is the fourth planet from the sun and the second-smallest planet in the solar system after mercury. ...

ARIA Test Cases - Accessibility
- - orca - - - - ffd - an interesting thing to note is that, when focus moves to an alert, jaws loses its place on the page, so that, when the alert disappears, jaws virtual cursor is at the bottom of the page. alertdialog alert dialog yui alert dialog (3rd button in this page) expected at behavior: at should speak the fact that this is an alert, the title and contents of the dialog, then place virtual focus or the real focus on the desired control (like a button). screen magnifier should show the focused button or emulate any other standard behavior found in notification dialogs in windows or respective operating systems. markup used: role="alert" aria-labeledby notes: in the uiuc test example, the 'close' button cannot recieve focus. re...

ARIA: banner role - Accessibility
nested document and/or application roles, each nested document or application role may also have one banner landmark. if a page includes more than one banner landmark, each should have a unique label. associated aria roles, states, and properties none keyboard interactions none required javascript features none examples here's a fake simple banner with a skip to navigation link, a logo, a title and a subtitle. as this is the main header for the site, we've added the banner landmark role to the container element. <div role="banner"> <a href="#nav" id="skiptomenu" class="skiptocontent">skip to keyboard navigation</a> <img src="images/w3c.png" alt="w3c logo"> <h1>aria landmarks</h1> <p>identifying page subsections for easy navigation</p> </div> we could also have written the above...

ARIA: form role - Accessibility
declare role="form". search if a form is used to search, you should use the more specialized role="search" value. labeling landmarks each <form> element and form role that needs to be exposed as a landmark must be given an accessible name. this name will allow an assitive technology user to be able to quickly understand the purpose of the form landmark. use an aria-labelledby, aria-label or title on the same element that was given the role="form" to provide it an accessible name. using role="form" <div role="form" id="gift-cards" aria-label="purchase a gift card"> <!-- form content --> </div> redundant descriptions screen readers will announce the type of role the landmark is. because of this, you do not need to describe what the landmark is in its label. for example, a declaration ...

ARIA: Region role - Accessibility
atically communicate a section has a role of region if it is given an accessible name. developers should always prefer using the correct semantic html element, in this case <section>, over using aria. associated wai-aria roles, states, and properties aria-labelledby use this attribute to label the region. often, the value of the aria-labelledby attribute will be the id of the element used to title the section. keyboard interactions none. required javascript features none. examples <div role="region" aria-labelledby="region-heading"> <h2 id="region-heading">this heading's <code>id</code> attribute helps this region have an accessible name</h2> <!-- region content --> </div> accessibility concerns use sparingly! landmark roles are intended to be used sparingly, to identify large...

HTML To MSAA - Accessibility
remarks the table below shows how gecko maps html elements to msaa. this table reflects mapping rules for specific elements only, it doesn't reflect any general rules applicable to all elements. for example, if name column has n/a value then it means specific elements doesn't provide own rules to calculate name but name can be computed from aria markup or @title attribute. map html element role name value states relations actions events notes a role_system_ link n/a value of @href attribute state_system_ selectable if @name attribute is presented state_system_ linked if @href attribute is presented or click event listener is registered state_system_ traversed if link is traversed n/a "jump" if @href is valid n/a br role_system_ whitespace '\n' (new line char) state_system_...

Accessibility documentation index - Accessibility
91 html to msaa accessibility the table below shows how gecko maps html elements to msaa. this table reflects mapping rules for specific elements only, it doesn't reflect any general rules applicable to all elements. for example, if name column has n/a value then it means specific elements doesn't provide own rules to calculate name but name can be computed from aria markup or @title attribute. 92 implementing a microsoft active accessibility (msaa) server accessibility, msaa, microsoft, server this document is for developers working to support msaa in an application in order to make it accessible with 3rd party assistive technologies, as well as for hackers wishing to be involved in mozilla's msaa support specifically. 93 keyboard-navigable jav...

Operable - Accessibility
navigation). this is often achieved using "skip links" — links put at the top of the page source that link to the main content and are hidden by css. if a proper structure of headings and semantic containers is provided to navigate with (for example <section>, <aside>, etc.), then an added "skip link" is not needed. need to add a section on "skip links". 2.4.2 include page title (a) each web page should include an informative <title>, the content of which describes the page's content/purpose. see adding a title. 2.4.3 logical focus order (a) the "tabbing order" of focusable page features (e.g. links, buttons, form inputs) makes logical sense, meaning that the page is still usable by non-sighted/keyboard users. see ui controls for general advice on tab...

Understandable - Accessibility
or at the very least provide definitions somewhere in the surrounding text, or in a description list at the bottom of the page. 3.1.4 abbreviations (aaa) where abbreviations are used, you should provide an expansion of them, or a definition as required. the <abbr> element is often thought of as the preferred way to provide an expansion for an abbreviation — it takes a title attribute that contains the expansion, and this appears when the acronym is moused over. however, the title contents are not accessible via keyboard, nor are they reliably read out by screenreaders. a better way to handle this is to again provide links to glossary pages containing the acronym expansion and explanation, or at the very least include them in the surrounding text in context. se...

Attribute selectors - CSS: Cascading Style Sheets
the css attribute selector matches elements based on the presence or value of a given attribute. /* <a> elements with a title attribute */ a[title] { color: purple; } /* <a> elements with an href matching "https://example.org" */ a[href="https://example.org"] { color: green; } /* <a> elements with an href containing "example" */ a[href*="example"] { font-size: 2em; } /* <a> elements with an href ending ".org" */ a[href$=".org"] { font-style: italic; } /* <a> elements whose class attribute contains the word "logo" */ a[class~="logo"] { padding: 2px; } syntax [attr] represents elements with an attribute name of attr. [attr=value] represents elements with an attribute name of attr whose value is exactly value. [attr~=value] represents elements with an attribute name of att...

Ordering Flex Items - CSS: Cascading Style Sheets
f the news item is the key thing to highlight and would be the element that a user might jump to if they were tabbing between headings to find content they wanted to read. the card also has a date; the finished design we want to create is something like this. visually the date appears above the heading, in the source. however, if the card was read out by a screen reader i would prefer that the title was announced first and then the publication date. we can make this so using the order property. the card is going to be our flex container, with flex-direction set to column. i then give the date an order of -1. this pulls it up above the heading. these small tweaks are the sort of cases where the order property makes sense. keep the logical order as the reading and tab order of the document,...

Questions about CSS - CSS: Cascading Style Sheets
designer or the viewer. with css, the sources of style definition for a given document element are in this order of precedence: the style attribute on an individual element tag the style element that defines a specific style sheet containing style declarations or a link element that links to a separate document containing the style element. in a web page, the style element is placed between the title statement and the body statement. an imported style sheet, using the css @import notation to automatically import and merge an external style sheet with the current style sheet style attributes specified by the viewer to the browser the default style sheet assumed by the browser in general, the web page creator's style sheet takes precedence, but it's recommended that browsers provide ways fo...

Linear-gradient Generator - CSS: Cascading Style Sheets
5c9bda; } .gradient-axis[axisid='3'] path { fill: #5c5cda; } .gradient-axis .rotate-point:hover { cursor: pointer; } /** * controls */ #controls { width: 100%; margin: 0 auto; display: table; } #controls .section { width: 50%; padding: 10px; display: table; float: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } #controls .section .title { width: 90%; margin: 0 0 10px 0; padding: 5px; border-bottom: 1px solid #ddd; font-size: 18px; color: #777; } #controls .property { width: 100%; height: 24px; margin: 10px 0; padding: 3px 0; display: table; } #controls .property > * { float: left; } #controls .property .name { width: 90px; padding: 0px 10px 0px 0px; text-align: right; line-height: 150%; } /* button */ #contro...

animation - CSS: Cascading Style Sheets
7a6; width: 100%; height: calc(100% - 1.5em); transform-origin: left center; } window.addeventlistener('load', function () { var animation = array.from(document.queryselectorall('.animation')); var button = array.from(document.queryselectorall('button')); function togglebutton (btn, type) { btn.classlist.remove('play', 'pause', 'restart'); btn.classlist.add(type); btn.title = type.touppercase(type); } function playpause (i) { var btn = button[i]; var anim = animation[i]; if (btn.classlist.contains('play')) { anim.style.animationplaystate = 'running'; togglebutton(btn, 'pause'); } else if (btn.classlist.contains('pause')) { anim.style.animationplaystate = 'paused'; togglebutton(btn, 'play'); } else { anim.classl...

<color> - CSS: Cascading Style Sheets
se -moz-field. see also -moz-eventreerow. -moz-win-communicationstext should be used for text in objects with -moz-appearance: -moz-win-communications-toolbox;. -moz-win-mediatext should be used for text in objects with -moz-appearance: -moz-win-media-toolbox. -moz-win-accentcolor used to access the windows 10 custom accent color that you can set on the start menu, taskbar, title bars, etc. -moz-win-accentcolortext used to access the color of text placed over the windows 10 custom accent color in the start menu, taskbar, title bars, etc. mozilla color preference extensions -moz-activehyperlinktext user's preference for text color of active links. should be used with the default document background color. -moz-default-background-color user's prefe...

text-transform - CSS: Cascading Style Sheets
onverts the first letter of each word to uppercase. other characters remain unchanged (they retain their original case as written in the element's text). a letter is defined as a character that is part of unicode's letter or number general categories ; thus, any punctuation marks or symbols at the beginning of a word are ignored. authors should not expect capitalize to follow language-specific title casing conventions (such as skipping articles in english). the capitalize keyword was under-specified in css 1 and css 2.1. this resulted in differences between browsers in the way the first letter was calculated (firefox considered - and _ as letters, but other browsers did not. both webkit and gecko incorrectly considered letter-based symbols like ⓐ to be real letters. internet explorer 9 wa...

Audio and Video Delivery - Developer guides
ad attribute may be ignored by some mobile browsers. ...

Content categories - Developer guides
tioning content model create a section in the current outline that defines the scope of <header> elements, <footer> elements, and heading content. elements belonging to this category are <article>, <aside>, <nav> and <section>. do not confuse this content model with the sectioning root category, which isolates its content from the regular outline. heading content heading content defines the title of a section, whether marked by an explicit sectioning content element, or implicitly defined by the heading content itself. elements belonging to this category are <h1>, <h2>, <h3>, <h4>, <h5>, <h6> and <hgroup>. though likely to contain heading content, the <header> is not heading content itself. note: the <hgroup> element was removed from the w3c html specification prior to html 5 being f...

Rich-Text Editing in Mozilla - Developer guides
tyle> </head> <body onload="initdoc();"> <form name="compform" method="post" action="sample.php" onsubmit="if(validatemode()){this.mydoc.value=odoc.innerhtml;return true;}return false;"> <input type="hidden" name="mydoc"> <div id="toolbar1"> <select onchange="formatdoc('formatblock',this[this.selectedindex].value);this.selectedindex=0;"> <option selected>- formatting -</option> <option value="h1">title 1 &lt;h1&gt;</option> <option value="h2">title 2 &lt;h2&gt;</option> <option value="h3">title 3 &lt;h3&gt;</option> <option value="h4">title 4 &lt;h4&gt;</option> <option value="h5">title 5 &lt;h5&gt;</option> <option value="h6">subtitle &lt;h6&gt;</option> <option value="p">paragraph &lt;p&gt;</option> <option value="pre">preformatted &lt;pre&gt;</option> </select> <select onchange="formatdoc('fo...

Making content editable - Developer guides
tyle> </head> <body onload="initdoc();"> <form name="compform" method="post" action="sample.php" onsubmit="if(validatemode()){this.mydoc.value=odoc.innerhtml;return true;}return false;"> <input type="hidden" name="mydoc"> <div id="toolbar1"> <select onchange="formatdoc('formatblock',this[this.selectedindex].value);this.selectedindex=0;"> <option selected>- formatting -</option> <option value="h1">title 1 &lt;h1&gt;</option> <option value="h2">title 2 &lt;h2&gt;</option> <option value="h3">title 3 &lt;h3&gt;</option> <option value="h4">title 4 &lt;h4&gt;</option> <option value="h5">title 5 &lt;h5&gt;</option> <option value="h6">subtitle &lt;h6&gt;</option> <option value="p">paragraph &lt;p&gt;</option> <option value="pre">preformatted &lt;pre&gt;</option> </select> <select onchange="formatdoc('fo...

The HTML autocomplete attribute - HTML: Hypertext Markup Language
ld that might be present. this may be used by the browser both to avoid accidentally filling in an existing password and to offer assistance in creating a secure password (see also preventing autofilling with autocomplete="new-password"). "current-password" the user's current password. "one-time-code" a one-time code used for verifying user identity. "organization-title" a job title, or the title a person has within an organization, such as "senior technical writer", "president", or "assistant troop leader". "organization" a company or organization name, such as "acme widget company" or "girl scouts of america". "street-address" a street address. this can be multiple lines of text, and should fully identify the location of the address within its second administrative level (typically a...

<h1>–<h6>: The HTML Section Heading elements - HTML: Hypertext Markup Language
m <h1>, next use <h2> and so on. you should only use one <h1> per page. using more than one will not result in an error, but using only one is seen as a best practice. it makes logical sense — <h1> is the most important heading, and tells you what the purpose of the overall page is. you wouldn't have a book with more than one title, or a movie with more than one name! having a single top-level title is also arguably better for screenreader users, and seo. examples all headings the following code shows all the heading levels, in use. <h1>heading level 1</h1> <h2>heading level 2</h2> <h3>heading level 3</h3> <h4>heading level 4</h4> <h5>heading level 5</h5> <h6>heading level 6</h6> here is the result of this code: example page the following code shows a few headings with some content...

<cite>: The Citation element - HTML: Hypertext Markup Language
the reference may be in an abbreviated form according to context-appropriate conventions related to citation metadata. the source for this interactive example is stored in a github repository. if you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request. content categories flow content, phrasing content, palpable content. permitted content phrasing content. tag omission none, both the starting and ending tag are mandatory. ...

<embed>: The Embed External Content element - HTML: Hypertext Markup Language
ce, in css pixels. this must be an absolute value; percentages are not allowed. usage notes you can use the object-position property to adjust the positioning of the embedded object within the element's frame, and the object-fit property to control how the object's size is adjusted to fit within the frame. examples <embed type="video/quicktime" src="movie.mov" width="640" height="480" title="title of my video"> accessibility concerns use the title attribute on an embed element to label its content so that people navigating with assistive technology such as a screen reader can understand what it contains. the title's value should concisely describe the embedded content. without a title, they may not be able to determine what its embedded content is. this context shift can be confusing and...

<head>: The Document Metadata (Header) element - HTML: Hypertext Markup Language
mation (metadata) about the document, like its title, scripts, and style sheets. note: <head> primarily holds information for machine processing, not human-readability. for human-visible information, like top-level headings and listed authors, see the <header> element. content categories none. permitted content if the document is an <iframe> srcdoc document, or if title information is available from a higher level protocol (like the subject line in html email), zero or more elements of metadata content. otherwise, one or more elements of metadata content where exactly one is a <title> element. tag omission the start tag may be omitted if the first thing inside the <head> element is an element. the end tag may be omitted if the first thing...

<hgroup> - HTML: Hypertext Markup Language
document might look like the following: that is, the rendered outline might show the primary title, html, followed by a colon and space, followed by the secondary title, living standard — last updated 12 august 2016. or, the rendered outline for that document might instead look like the following: that is, the rendered outline might show the primary title, html, followed by the secondary title shown in parentheses: (living standard — last updated 12 august 2016). examples <hgroup id="document-title"> <h1>html</h1> <h2>living standard — last updated 12 august 2016</h2> </hgroup> specifications specification status comment html living standardthe definition of '<hgroup>' in that specification. living standard ...

<iframe>: The Inline Frame element - HTML: Hypertext Markup Language
cross-origin communication can be achieved using window.postmessage(). positioning and scaling as a replaced element, the position, alignment, and scaling of the embedded document within the <iframe> element's box, can be adjusted with the object-position and object-fit properties. examples a simple <iframe> an <iframe> in action. after creating the frame, when the user clicks a button, its title is displayed in an alert. html <iframe src="https://mdn-samples.mozilla.org/snippets/html/iframe-simple-contents.html" title="iframe example 1" width="400" height="300"> </iframe> result accessibility concerns people navigating with assistive technology such as a screen reader can use the title attribute on an <iframe> to label its content. the title's value should concisely d...

<input type="password"> - HTML: Hypertext Markup Language
ur guide on regular expressions; the 'u' flag is specified when compiling the regular expression, so that the pattern is treated as a sequence of unicode code points, instead of as ascii. no forward slashes should be specified around the pattern text. if the specified pattern is not specified or is invalid, no regular expression is applied and this attribute is ignored completely. tip: use the title attribute to specify text that most browsers will display as a tooltip to explain what the requirements are to match the pattern. you should also include other explanatory text nearby. use of a pattern is strongly recommended for password inputs, in order to help ensure that valid passwords using a wide assortment of character classes are selected and used by your users. with a pattern, you can ...

<input type="reset"> - HTML: Hypertext Markup Language
the user to know what the access key is! this is especially true since the modifiers are typically non-standard to avoid conflicts. when building a site, be sure to provide this information in a way that doesn't interfere with the site design (for example by providing an easily accessible link that points to information on what the site access keys are). adding a tooltip to the button (using the title attribute) can also help, although it's not a complete solution for accessibility purposes. disabling and enabling a reset button to disable a reset button, simply specify the disabled global attribute on it, like so: <input type="reset" value="disabled" disabled> you can enable and disable buttons at run time by simply setting disabled to true or false; in javascript this looks like btn.dis...

<input type="search"> - HTML: Hypertext Markup Language
ur guide on regular expressions; the 'u' flag is specified when compiling the regular expression, so that the pattern is treated as a sequence of unicode code points, instead of as ascii. no forward slashes should be specified around the pattern text. if the specified pattern is not specified or is invalid, no regular expression is applied and this attribute is ignored completely. tip: use the title attribute to specify text that most browsers will display as a tooltip to explain what the requirements are to match the pattern. you should also include other explanatory text nearby. see the section specifying a pattern for details and an example. placeholder the placeholder attribute is a string that provides a brief hint to the user as to what kind of information is expected in the field. ...

<input type="submit"> - HTML: Hypertext Markup Language
ser will not know what the access key is! this is especially true since the modifiers are typically non-standard to avoid conflicts. when building a site, be sure to provide this information in a way that doesn't interfere with the site design (for example by providing an easily accessible link that points to information on what the site access keys are). adding a tooltip to the button (using the title attribute) can also help, although it's not a complete solution for accessibility purposes. disabling and enabling a submit button to disable a submit button, simply specify the disabled global attribute on it, like so: <input type="submit" value="disabled" disabled> you can enable and disable buttons at run time by simply setting disabled to true or false; in javascript this looks like btn.

<input type="tel"> - HTML: Hypertext Markup Language
ur guide on regular expressions; the 'u' flag is specified when compiling the regular expression, so that the pattern is treated as a sequence of unicode code points, instead of as ascii. no forward slashes should be specified around the pattern text. if the specified pattern is not specified or is invalid, no regular expression is applied and this attribute is ignored completely. tip: use the title attribute to specify text that most browsers will display as a tooltip to explain what the requirements are to match the pattern. you should also include other explanatory text nearby. see pattern validation below for details and an example. placeholder the placeholder attribute is a string that provides a brief hint to the user as to what kind of information is expected in the field. it shoul...

<input type="text"> - HTML: Hypertext Markup Language
ur guide on regular expressions; the 'u' flag is specified when compiling the regular expression, so that the pattern is treated as a sequence of unicode code points, instead of as ascii. no forward slashes should be specified around the pattern text. if the specified pattern is not specified or is invalid, no regular expression is applied and this attribute is ignored completely. tip: use the title attribute to specify text that most browsers will display as a tooltip to explain what the requirements are to match the pattern. you should also include other explanatory text nearby. see specifying a pattern for further details and an example. placeholder the placeholder attribute is a string that provides a brief hint to the user as to what kind of information is expected in the field. it ...

<menuitem> - HTML: Hypertext Markup Language
s the <menu> element, where that element is in the popup menu state. (if specified, the type attribute of the <menu> element must be popup; if missing, the parent element of the <menu> must itself be a <menu> in the popup menu state.) permitted aria roles none dom interface htmlmenuitemelement attributes this element includes the global attributes; in particular title can be used to describe the command, or provide usage hints. checked boolean attribute which indicates whether the command is selected. may only be used when the type attribute is checkbox or radio. command specifies the id of a separate element, indicating a command to be invoked indirectly. may not be used within a menu item that also includes the attributes checked, disabled, icon, label,...

<style>: The Style Information element - HTML: Hypertext Markup Language
d to. its value is a media query, which defaults to all if the attribute is missing. nonce a cryptographic nonce (number used once) used to whitelist inline styles in a style-src content-security-policy. the server must generate a unique nonce value each time it transmits a policy. it is critical to provide a nonce that cannot be guessed as bypassing a resource’s policy is otherwise trivial. title this attribute specifies alternative style sheet sets. deprecated attributes scoped this attribute specifies that the styles only apply to the elements of its parent(s) and children. this attribute may be re-introduced in the future per https://github.com/w3c/csswg-drafts/issues/3547. if you want to use the attribute now, you can use a polyfill. examples a simple stylesheet...

<td>: The Table Data Cell element - HTML: Hypertext Markup Language
65534. deprecated attributes abbr this attribute contains a short abbreviated description of the cell's content. some user-agents, such as speech readers, may present this description before the content itself. note: do not use this attribute as it is obsolete in the latest standard. alternatively, you can put the abbreviated description inside the cell and place the long content in the title attribute. align this enumerated attribute specifies how the cell content's horizontal alignment will be handled. possible values are: left: the content is aligned to the left of the cell. center: the content is centered in the cell. right: the content is aligned to the right of the cell. justify (with text only): the content is stretched out inside the cell so that it covers its e...

<track>: The Embed Text Track element - HTML: Hypertext Markup Language
deaf or when the sound is muted. descriptions textual description of the video content. suitable for users who are blind or where the video cannot be seen. chapters chapter titles are intended to be used when the user is navigating the media resource. metadata tracks used by scripts. not visible to the user. label a user-readable title of the text track which is used by the browser when listing available text tracks. src address of the track (.vtt file). must be a valid url. this attribute must be specified and its url value must have the same origin as the document — unless the <audio> or <video> parent element of the track element has a crossorigin attribute. srclang language of the track text data. it must be a valid bc...

<u>: The Unarticulated Annotation (Underline) element - HTML: Hypertext Markup Language
hat show what you should do instead in several cases. non-semantic underlines to underline text without implying any semantic meaning, use a <span> element with the text-decoration property set to "underline", as shown below. html <span class="underline">today's special</span> <br> chicken noodle soup with carrots css .underline { text-decoration: underline; } result presenting a book title book titles should be presented using the <cite> element instead of <u> or even <i>. html <p>the class read <cite>moby dick</cite> in the first term.</p> result with default style note that the default styling for the <cite> element renders the text in italics. you can, if you wish, override that using css: cite { font-style: normal; text-decoration: underline; } result with custom ...

itemprop - HTML: Hypertext Markup Language
">2</p> </div> as is the following <div itemscope> <p itemprop="a">1</p> <p itemprop="b">test</p> <p itemprop="a">2</p> </div> and the following <div id="x"> <p itemprop="a">1</p> </div> <div itemscope itemref="x"> <p itemprop="b">test</p> <p itemprop="a">2</p> </div> other examples html <dl itemscope itemtype="http://vocab.example.net/book" itemid="urn:isbn:0-330-34032-8"> <dt>title <dd itemprop="title">the reality dysfunction <dt>author <dd itemprop="author">peter f. hamilton <dt>publication date <dd><time itemprop="pubdate" datetime="1996-01-26">26 january 1996</time> </dl> structured data itemscope itemtype: itemid http://vocab.example.net/book: urn:isbn:0-330-34032-8 itemprop title the reality dysfunction i...

Microformats - HTML: Hypertext Markup Language
class="p-author h-card" href="http://example.com">w. ...

Data URLs - HTTP
have been associated with data urls, and navigating to them in the browser's top level. to mitigate such issues, top-level navigation to data:// urls has been blocked in firefox 59+ (release version, nightly/beta from 58), and we hope to see other browsers follow suit soon. see blocking top-level navigations to data urls for firefox 58 for more details. specifications specification title rfc 2397 the "data" url scheme ...

Identifying resources on the Web - HTTP
s typed directly into the browser's url bar, or the target of a link), although some browsers may delegate loading ftp content to another application. examples https://developer.mozilla.org/docs/learn tel:+1-816-555-1212 git@github.com:mdn/browser-compat-data.git ftp://example.org/resource.txt urn:isbn:9780141036144 mailto:help@supercyberhelpdesk.info specifications specification title rfc 7230, section 2.7: uniform resource identifiers hypertext transfer protocol (http/1.1): message syntax and routing ...

Accept-Charset - HTTP
utf-8 or iso-8859-15. * any charset not mentioned elsewhere in the header; * is used as a wildcard. ...

Accept-Encoding - HTTP
der is not present. it doesn't mean that any algorithm is supported; merely that no preference is expressed. ...

Accept-Language - HTTP
ke the type of orthography ('de-de-1996') are usually not used in the context of this header. * any language; '*' is used as a wildcard. ...

Accept-Patch - HTTP
header forbidden header name yes syntax accept-patch: application/example, text/example accept-patch: text/example;charset=utf-8 accept-patch: application/merge-patch+json directives none examples accept-patch: application/example, text/example accept-patch: text/example;charset=utf-8 accept-patch: application/merge-patch+json specifications specification title rfc 5789, section 3.1: accept-patch http patch ...

Accept-Ranges - HTTP
ly defined by rfc 7233, additional range units may be registered in the http range unit registry. ...

Accept - HTTP
ge types. ...

Age - HTTP
ce between the proxy's current date and the date general header included in the http response. ...

Allow - HTTP
ndicates that the resource allows no request methods, which might occur temporarily for a given resource, for example. ...

Authorization - HTTP
secure as sending the credentials in clear text (base64 is a reversible encoding). prefer to use https in conjunction with basic authentication. ...

Clear-Site-Data - HTTP
...

Content-Disposition - HTTP
ted using the multipart/form-data format that makes use of the content-disposition header: post /test.html http/1.1 host: example.org content-type: multipart/form-data;boundary="boundary" --boundary content-disposition: form-data; name="field1" value1 --boundary content-disposition: form-data; name="field2"; filename="example.txt" value2 --boundary-- specifications specification title rfc 7578 returning values from forms: multipart/form-data rfc 6266 use of the content-disposition header field in the hypertext transfer protocol (http) rfc 2183 communicating presentation information in internet messages: the content-disposition header field ...

Content-Encoding - HTTP
accept-encoding header is used for negotiating content encoding. accept-encoding: gzip, deflate the server responds with the scheme used, indicated by the content-encoding response header. content-encoding: gzip note that the server is not obligated to use any compression method. ...

Content-Language - HTTP
e this meta element like this for stating a document language: <!-- /!\ this is bad practice --> <meta http-equiv="content-language" content="de"> indicating a target audience for a resource the content-language header is used to specify the intended audience of the page, and can indicate that this is more than one language. content-language: de, en specifications specification title rfc 7231, section 3.1.3.2: content-language hypertext transfer protocol (http/1.1): semantics and content ...

Content-Length - HTTP
the content-length entity header indicates the size of the entity-body, in bytes, sent to the recipient. ...

Content-Location - HTTP
> when the form is submitted, the site generates a receipt for the transaction. ...

Content-Range - HTTP
> the unit in which ranges are specified. this is usually bytes. ...

Content-Type - HTTP
-------------------974767299852498929531610575 content-disposition: form-data; name="description" some text -----------------------------974767299852498929531610575 content-disposition: form-data; name="myfile"; filename="foo.txt" content-type: text/plain (content of the uploaded file foo.txt) -----------------------------974767299852498929531610575-- specifications specification title rfc 7233, section 4.1: content-type in multipart hypertext transfer protocol (http/1.1): range requests rfc 7231, section 3.1.1.5: content-type hypertext transfer protocol (http/1.1): semantics and content ...

Cookie - HTTP
ader name yes syntax cookie: <cookie-list> cookie: name=value cookie: name=value; name2=value2; name3=value3 <cookie-list> a list of name-value pairs in the form of <cookie-name>=<cookie-value>. pairs in the list are separated by a semicolon and a space ('; '). examples cookie: phpsessid=298zf09hf012fh2; csrftoken=u32t4o3tb3gg43; _gat=1 specifications specification title rfc 6265, section 5.4: cookie http state management mechanism ...

Cookie2 - HTTP
the obsolete cookie2 http request header used to advise the server that the user agent understands "new-style" cookies, but nowadays user agents will use the cookie header instead, not this one. header type request header forbidden header name yes examples cookie2: $version="1" specifications specification title rfc 2965: cookie2 historic specification of http state management mechanism, obsoleted by rfc 6265 ...

Date - HTTP
hour> 2 digit hour number, e.g. "09" or "23". <minute> 2 digit minute number, e.g. "04" or "59". ...

Digest - HTTP
he result of applying the digest algorithm to the resource representation and encoding the result. the choice of digest algorithm also determines the encoding to use: for example sha-256 uses base64 encoding. examples digest: sha-256=x48e9qookqqrvdts8nojrjn3owduoywxbf7kbu9dbpe= digest: sha-256=x48e9qookqqrvdts8nojrjn3owduoywxbf7kbu9dbpe=,unixsum=30637 specifications specification title draft-ietf-httpbis-digest-headers-latest resource digests for http this header was originally defined in rfc 3230, but the definition of "selected representation" in rfc 7231 made the original definition inconsistent with current http specifications. when released, the "resource digests for http" draft therefore will obsolete rfc 3230 and will update the standard to...

ETag - HTTP
5d9f25f89d4" the server compares the client's etag (sent with if-none-match) with the etag for its current version of the resource, and if both values match (that is, the resource has not changed), the server sends back a 304 not modified status, without a body, which tells the client that the cached version of the response is still good to use (fresh). specifications specification title rfc 7232, section 2.3: etag hypertext transfer protocol (http/1.1): conditional requests ...

Early-Data - HTTP
early data, and also indicates that the intermediary understands the 425 (too early) status code. ...

Expect-CT - HTTP
nless the site has 'proven' it can serve a certificate satisfying the certificate transparency requirements. browsers implement their own trust model regarding which ct logs are considered trusted for the certificate to have been logged to. builds of chrome are designed to stop enforcing the expect-ct policy 10 weeks after the installation's build date. specifications specification title internet draft expect-ct extension for http ...

Expect - HTTP
n http/1.1 host: origin.example.com content-type: video/h264 content-length: 1234567890987 expect: 100-continue the server now checks the request headers and may respond with a 100 (continue) response to instruct the client to go ahead and send the message body, or it will send a 417 (expectation failed) status if any of the expectations cannot be met. specifications specification title rfc 7231, section 5.1.1: expect hypertext transfer protocol (http/1.1): semantics and content ...

Expires - HTTP
with the max-age or s-maxage directive in the response, the expires header is ignored. ...

Forwarded - HTTP
ion, server, or proxy supports the standardized forwarded header, the x-forwarded-for header can be replaced. note that ipv6 address are quoted and enclosed in square brackets in forwarded. x-forwarded-for: 123.34.567.89 forwarded: for=123.34.567.89 x-forwarded-for: 192.0.2.43, "[2001:db8:cafe::17]" forwarded: for=192.0.2.43, for="[2001:db8:cafe::17]" specifications specification title rfc 7239, section 4: forwarded forwarded http extension ...

From - HTTP
ers, such as if the robot is sending excessive, unwanted, or invalid requests. ...

Host - HTTP
ks a host header field or that contains more than one. ...

If-Match - HTTP
o indicate that they are "weak", i.e. that they represent the resource semantically, but not byte-for-byte. ...

If-Modified-Since - HTTP
r> 4 digit year number, e.g. "1990" or "2016". <hour> 2 digit hour number, e.g. "09" or "23". ...

If-None-Match - HTTP
lgorithm). * the asterisk is a special value representing any resource. ...

If-Range - HTTP
e). <year> 4 digit year number, e.g. "1990" or "2016". <hour> 2 digit hour number, e.g. "09" or "23". ...

If-Unmodified-Since - HTTP
4 digit year number, e.g. "1990" or "2016". <hour> 2 digit hour number, e.g. "09" or "23". <minute> 2 digit minute number, e.g. ...

Keep-Alive - HTTP
ponse. an http pipeline can use it to limit the pipelining. ...

Last-Modified - HTTP
<year> 4 digit year number, e.g. "1990" or "2016". <hour> 2 digit hour number, e.g. "09" or "23". ...

Location - HTTP
urther content negotiation. ...

Pragma - HTTP
specified and thus implementation-specific. ...

Proxy-Authenticate - HTTP
ives <type> authentication type. a common type is "basic". iana maintains a list of authentication schemes. ...

Proxy-Authorization - HTTP
g string is base64 encoded (ywxhzgrpbjpvcgvuc2vzyw1l). ...

Public-Key-Pins-Report-Only - HTTP
r's public key used in production. ...

Public-Key-Pins - HTTP
ackup key. ...

Range - HTTP
<suffix-length> an integer in the given unit indicating the number of units at the end of the file to return. ...

Referer - HTTP
directives <url> an absolute or partial address of the previous web page from which a link to the currently requested page was followed. url fragments (i.e. "#section") and userinfo (i.e. "username:password" in "https://username:password@example.com/foo/bar/") are not included. examples referer: https://developer.mozilla.org/docs/web/javascript specifications specification title rfc 7231, section 5.5.2: referer hypertext transfer protocol (http/1.1): semantics and content ...

Retry-After - HTTP
eader on both clients and servers is still inconsistent. ...

Save-Data - HTTP
ntent-length: 102832 vary: accept-encoding, save-data cache-control: public, max-age=31536000 content-type: image/jpeg [...] without save-data request: get /image.jpg http/1.0 host: example.com response: http/1.0 200 ok content-length: 481770 vary: accept-encoding, save-data cache-control: public, max-age=31536000 content-type: image/jpeg [...] specifications specification title draft-grigorik-http-client-hints-03, section 7: save-data http client hints ...

Sec-Fetch-Dest - HTTP
ec-fetch-dest: worker sec-fetch-dest: xslt sec-fetch-dest: audioworklet sec-fetch-dest: audioworklet values audio audioworklet document embed empty font image manifest object paintworklet report script serviceworker sharedworker style track video worker xslt nested-document examples todo specifications specification title fetch metadata request headers the sec-fetch-dest http request header ...

Sec-Fetch-Mode - HTTP
me yes, since it has prefix sec- cors-safelisted request header syntax sec-fetch-mode: cors sec-fetch-mode: navigate sec-fetch-mode: nested-navigate sec-fetch-mode: no-cors sec-fetch-mode: same-origin sec-fetch-mode: websocket values cors navigate nested-navigate no-cors same-origin websocket examples todo specifications specification title fetch metadata request headers the sec-fetch-mode http request header ...

Sec-Fetch-Site - HTTP
ite sec-fetch-site: none values cross-site same-origin same-site none this request does not relate to any context like site, origin, or frame. this can happen when user had initiated this request by, e.g. directly entering a url in the address bar, opening a bookmark, or draging-and-dropping a file into the browser window. examples todo specifications specification title fetch metadata request headers the sec-fetch-site http request header ...

Sec-Fetch-User - HTTP
r name yes, since it has prefix sec- cors-safelisted request header syntax sec-fetch-user: ?0 sec-fetch-user: ?1 values the value is a boolean structured header. ?0 the navigation request was triggered by a user activation. ?1 the navigation request was triggered by something other than a user activation. examples todo specifications specification title fetch metadata request headers the sec-fetch-user http request header ...

Sec-WebSocket-Accept - HTTP
bidden header name no syntax sec-websocket-accept: <hashed key> directives <hashed key> the server takes the value of the sec-websocket-key sent in the handshake request, appends 258eafa5-e914-47da-95ca-c5ab0dc85b11, takes sha-1 of the new value, and is then base64 encoded. examples sec-websocket-accept: s3pplmbitxaq9kygzzhzrbk+xoo= specification specification title rfc 6455, section 11.3.3: sec-websocket-accept the websocket protocol ...

Server-Timing - HTTP
manceservertiming interface enables tools to automatically collect and process metrics from javascript. this interface is restricted to the same origin, but you can use the timing-allow-origin header to specify the domains that are allowed to access the server metrics. the interface is only available in secure contexts (https) in some browsers. specifications specification status title server timingthe definition of 'server-timing header field' in that specification. working draft initial definition. ...

Server - HTTP
agent. ...

SameSite cookies - HTTP
av=$1 [nc,l,qsa,co=rewriterule;02;https://www.example.org;30/;samesite=none;secure] rewriterule "^(.*)\.html$" "index.php?nav=$1 [nc,l,qsa,co=rewriterule;03;https://www.example.org;30/;samesite=none;secure] [...] rewriterule "^admin/(.*)\.html$" "admin/index.php?nav=$1 [nc,l,qsa,co=rewriterule;09;https://www.example.org:30/;samesite=strict;secure] specifications specification title rfc 6265, section 4.1: set-cookie http state management mechanism draft-ietf-httpbis-rfc6265bis-05 cookie prefixes, same-site cookies, and strict secure cookies ...

Set-Cookie - HTTP
(https) set-cookie: __secure-id=123; secure; domain=example.com set-cookie: __host-id=123; secure; path=/ // rejected due to missing secure attribute set-cookie: __secure-id=1 // rejected due to the missing path=/ attribute set-cookie: __host-id=1; secure // rejected due to setting a domain set-cookie: __host-id=1; secure; path=/; domain=example.com specifications specification title rfc 6265, section 4.1: set-cookie http state management mechanism draft-ietf-httpbis-rfc6265bis-05 cookie prefixes, same-site cookies, and strict secure cookies ...

Set-Cookie2 - HTTP
cookie-name>=<cookie-value>; secure set-cookie2: <cookie-name>=<cookie-value>; version=<version-number> // multiple directives are also possible, for example: set-cookie2: <cookie-name>=<cookie-value>; domain=<domain-value>; secure // multiple cookies are seperated by a comma set-cookie2: <cookie-name>=<cookie-value>, <cookie-name>=<cookie-value>, ... specifications specification title rfc 2965: set-cookie2 historic specification of http state management mechanism, obsoleted by rfc 6265 ...

SourceMap - HTTP
ginal source and present the reconstructed original in the debugger. ...

TE - HTTP
coding name. ...

Trailer - HTTP
nked transfer encoding using a trailing header in this example, the expires header is used at the end of the chunked message and serves as a trailing header. ...

Transfer-Encoding - HTTP
esponse may not be known until the request has been fully processed. ...

User-Agent - HTTP
ples mozilla/5.0 (iphone; cpu iphone os 13_5_1 like mac os x) applewebkit/605.1.15 (khtml, like gecko) version/13.1.1 mobile/15e148 safari/604.1 internet explorer ua string examples mozilla/5.0 (compatible; msie 9.0; windows phone os 7.5; trident/5.0; iemobile/9.0) crawler and bot ua strings examples googlebot/2.1 (+http://www.google.com/bot.html) specifications specification title rfc 7231, section 5.5.3: user-agent hypertext transfer protocol (http/1.1): semantics and content rfc 2616, section 14.43: user-agent hypertext transfer protocol -- http/1.1 ...

Vary - HTTP
e page from cache. ...

Via - HTTP
ol-version> <pseudonym> directives <protocol-name> optional. the name of the protocol used, such as "http". ...

WWW-Authenticate - HTTP
ring. ...

Want-Digest - HTTP
when released, the "resource digests for http" draft therefore will obsolete rfc 3230 and will update the standard to...

Warning - HTTP
rmation to the representation, such as changing the content-coding, media-type or the like. ...

X-Frame-Options - HTTP
eader, you can use helmet which uses frameguard to set the header. ...

CONNECT - HTTP
idempotent no cacheable no allowed in html forms no syntax connect www.example.com:443 http/1.1 example some proxy servers might need authority to create a tunnel. see also the proxy-authorization header. connect server.example.com:80 http/1.1 host: server.example.com:80 proxy-authorization: basic agvsbg86d29ybgq= specifications specification title rfc 7231, section 4.3.6: connect hypertext transfer protocol (http/1.1): semantics and content ...

DELETE - HTTP
d. a 204 (no content) status code if the action has been enacted and no further information is to be supplied. ...

GET - HTTP
the http get method requests a representation of the specified resource. requests using get should only retrieve data. ...

HEAD - HTTP
nse to a head request shows that a cached url response is now outdated, the cached copy is invalidated even if no get request was made. request has body no successful response has body no safe yes idempotent yes cacheable yes allowed in html forms no syntax head /index.html specifications specification title rfc 7231, section 4.3.2: head hypertext transfer protocol (http/1.1): semantics and content ...

OPTIONS - HTTP
http/1.1 204 no content date: mon, 01 dec 2008 01:15:39 gmt server: apache/2.0.61 (unix) access-control-allow-origin: https://foo.example access-control-allow-methods: post, get, options access-control-allow-headers: x-pingother, content-type access-control-max-age: 86400 vary: accept-encoding, origin keep-alive: timeout=2, max=100 connection: keep-alive specifications specification title rfc 7231, section 4.3.7: options hypertext transfer protocol (http/1.1): semantics and content ...

PATCH - HTTP
h: "e0023aa4e" content-length: 100 [description of changes] response a successful response is indicated by any 2xx status code. in the example below a 204 response code is used, because the response does not carry a payload body. a 200 response could have contained a payload body. http/1.1 204 no content content-location: /file.txt etag: "e0023aa4f" specifications specification title rfc 5789: patch patch method for http ...

POST - HTTP
nt-length: 27 field1=value1&field2=value2 a form using the multipart/form-data content type: post /test http/1.1 host: foo.example content-type: multipart/form-data;boundary="boundary" --boundary content-disposition: form-data; name="field1" value1 --boundary content-disposition: form-data; name="field2"; filename="example.txt" value2 --boundary-- specifications specification title rfc 7231, section 4.3.3: post hypertext transfer protocol (http/1.1): semantics and content rfc 2046, section 5.1.1: common syntax multipurpose internet mail extensions (mime) part two: media types ...

PUT - HTTP
the target resource does have a current representation and that representation is successfully modified in accordance with the state of the enclosed representation, then the origin server must send either a 200 (ok) or a 204 (no content) response to indicate successful completion of the request. http/1.1 204 no content content-location: /existing.html specifications specification title rfc 7231, section 4.3.4: put hypertext transfer protocol (http/1.1): semantics and content ...

TRACE - HTTP
f message/http. ...

HTTP request methods - HTTP
od establishes a tunnel to the server identified by the target resource. options the options method is used to describe the communication options for the target resource. trace the trace method performs a message loop-back test along the path to the target resource. patch the patch method is used to apply partial modifications to a resource. specifications specification title comment rfc 7231, section 4: request methods hypertext transfer protocol (http/1.1): semantics and content specifies get, head, post, put, delete, connect, options, trace. rfc 5789, section 2: patch method patch method for http specifies patch. ...

HTTP Public Key Pinning (HPKP) - HTTP
line to the web.config file to send the public-key-pins header: <system.webserver> ... ...

HTTP resources and specifications - HTTP
http was first specified in the early 1990s. designed with extensibility in mind, it has seen numerous additions over the years; this lead to its specification being scattered through numerous specification documents (in the midst of experimental abandoned extensions). this page lists relevant resources about http. ...

100 Continue - HTTP
code indicates that everything so far is ok and that the client should continue with the request or ignore it if it is already finished. to have a server check the request's headers, a client must send expect: 100-continue as a header in its initial request and receive a 100 continue status code in response before sending the body. status 100 continue specifications specification title rfc 7231, section 6.2.1: 100 continue hypertext transfer protocol (http/1.1): semantics and content ...

101 Switching Protocols - HTTP
der. the server includes in this response an upgrade response header to indicate the protocol it switched to. ...

200 OK - HTTP
sage body. post: the resource describing the result of the action is transmitted in the message body. ...

201 Created - HTTP
led to the creation of a resource. ...

202 Accepted - HTTP
e acted upon, as it might be disallowed when processing actually takes place. ...

203 Non-Authoritative Information - HTTP
the enclosed payload has been modified by a transforming proxy from that of the origin server's 200 (ok) response . ...

204 No Content - HTTP
d in such a response. ...

205 Reset Content - HTTP
the http 205 reset content response status tells the client to reset the document view, so for example to clear the content of a form, reset a canvas state, or to refresh the ui. status 205 reset content specifications specification title rfc 7231, section 6.3.6: 205 reset content hypertext transfer protocol (http/1.1): semantics and content compatibility notes browser behavior differs if this response erroneously includes a body on persistent connections see 204 no content for more detail. ...

206 Partial Content - HTTP
modified: wed, 15 nov 2015 04:58:08 gmt content-length: 1741 content-type: multipart/byteranges; boundary=string_separator --string_separator content-type: application/pdf content-range: bytes 234-639/8000 ...the first range... --string_separator content-type: application/pdf content-range: bytes 4590-7999/8000 ...the second range --string_separator-- specifications specification title rfc 7233, section 4.1: 206 partial content hypertext transfer protocol (http/1.1): range requests ...

300 Multiple Choices - HTTP
ct status response code indicates that the request has more than one possible responses. ...

301 Moved Permanently - HTTP
response for get or head methods and to use the 308 permanent redirect for post methods instead, as the method change is explicitly prohibited with this status. status 301 moved permanently example client request get /index.php http/1.1 host: www.example.org server response http/1.1 301 moved permanently location: http://www.example.org/index.asp specifications specification title rfc 7231, section 6.4.2: 301 moved permanently hypertext transfer protocol (http/1.1): semantics and content ...

302 Found - HTTP
edirect instead, as the method change is explicitly prohibited in that case. ...

303 See Other - HTTP
(http) 303 see other redirect status response code indicates that the redirects don't link to the newly uploaded resources, but to another page (such as a confirmation page or an upload progress page). this response code is usually sent back as a result of put or post. the method used to display this redirected page is always get. status 303 see other specifications specification title rfc 7231, section 6.4.4: 303 see other hypertext transfer protocol (http/1.1): semantics and content ...

304 Not Modified - HTTP
-match or a if-modified-since header. ...

307 Temporary Redirect - HTTP
t the method and the body will not be changed when the redirected request is made. ...

308 Permanent Redirect - HTTP
ll not be altered, whereas 301 may incorrectly sometimes be changed to a get method. ...

400 Bad Request - HTTP
l (http) 400 bad request response status code indicates that the server cannot or will not process the request due to something that is perceived to be a client error (e.g., malformed request syntax, invalid request message framing, or deceptive request routing). the client should not repeat this request without modification. status 400 bad request specifications specification title rfc 7231, section 6.5.1: 400 bad request hypertext transfer protocol (http/1.1): semantics and content ...

401 Unauthorized - HTTP
source. ...

402 Payment Required - HTTP
enable digital cash or (micro) payment systems and would indicate that the requested content is not available until the client makes a payment. however, no standard use convention exists and different entities use it in different contexts. status 402 payment required example response http/1.1 402 payment required date: wed, 21 oct 2015 07:28:00 gmt specifications specification title rfc 7231, section 6.5.2: 402 payment required http/1.1: semantics and content ...

403 Forbidden - HTTP
rstood the request but refuses to authorize it. ...

404 Not Found - HTTP
guidance on what to do next. ...

405 Method Not Allowed - HTTP
the hypertext transfer protocol (http) 405 method not allowed response status code indicates that the request method is known by the server but is not supported by the target resource. the server must generate an allow header field in a 405 response containing a list of the target resource's currently supported methods. status 405 method not allowed specifications specification title rfc 7231, section 6.5.5: 405 method not allowed hypertext transfer protocol (http/1.1): semantics and content ...

406 Not Acceptable - HTTP
eader and serve an actual page to the user. ...

407 Proxy Authentication Required - HTTP
erver that can access the requested resource. ...

408 Request Timeout - HTTP
ince 408 implies that the server has decided to close the connection rather than continue waiting. ...

409 Conflict - HTTP
the http 409 conflict response status code indicates a request conflict with current state of the server. ...

410 Gone - HTTP
p) 410 gone client error response code indicates that access to the target resource is no longer available at the origin server and that this condition is likely to be permanent. if you don't know whether this condition is temporary or permanent, a 404 status code should be used instead. note: a 410 response is cacheable by default. status 410 gone specifications specification title rfc 7231, section 6.5.9: 410 gone hypertext transfer protocol (http/1.1): semantics and content ...

411 Length Required - HTTP
erver refuses to accept the request without a defined content-length header. ...

412 Precondition Failed - HTTP
48795d9f25f89d4" when saving changes to a wiki page (posting data), the post request will contain the if-match header containing the etag values to check freshness against. if-match: "33a64df551425fcc55e4d42a148795d9f25f89d4" if the hashes don't match, it means that the document has been edited in-between and a 412 precondition failed error is thrown. specifications specification title rfc 7232, section 4.2: 412 precondition failed hypertext transfer protocol (http/1.1): conditional requests ...

413 Payload Too Large - HTTP
the http 413 payload too large response status code indicates that the request entity is larger than limits defined by server; the server might close the connection or return a retry-after header field. status 413 payload too large specifications specification title rfc 7231, section 6.5.11: 413 payload too large hypertext transfer protocol (http/1.1): semantics and content ...

414 URI Too Long - HTTP
when a client has improperly converted a post request to a get request with long query information, when the client has descended into a loop of redirection (for example, a redirected uri prefix that points to a suffix of itself), or when the server is under attack by a client attempting to exploit potential security holes. status 414 uri too long specifications specification title rfc 7231, section 6.5.12: 414 uri too long hypertext transfer protocol (http/1.1): semantics and content ...

415 Unsupported Media Type - HTTP
the http 415 unsupported media type client error response code indicates that the server refuses to accept the request because the payload format is in an unsupported format. the format problem might be due to the request's indicated content-type or content-encoding, or as a result of inspecting the data directly. status 415 unsupported media type specifications specification title rfc 7231, section 6.5.13: 415 unsupported media type hypertext transfer protocol (http/1.1): semantics and content ...

416 Range Not Satisfiable - HTTP
content-range indicating an unsatisfied range (that is a '*') followed by a '/' and the current length of the resource. e.g. ...

417 Expectation Failed - HTTP
the http 417 expectation failed client error response code indicates that the expectation given in the request's expect header could not be met. see the expect header for more details. status 417 expectation failed specifications specification title rfc 7231, section 6.5.14: 417 expectation failed hypertext transfer protocol (http/1.1): semantics and content ...

418 I'm a teapot - HTTP
i'm a teapot client error response code indicates that the server refuses to brew coffee because it is, permanently, a teapot. a combined coffee/tea pot that is temporarily out of coffee should instead return 503. ...

422 Unprocessable Entity - HTTP
rotocol (http) 422 unprocessable entity response status code indicates that the server understands the content type of the request entity, and the syntax of the request entity is correct, but it was unable to process the contained instructions. important: the client should not repeat this request without modification. status 422 unprocessable entity specifications specification title rfc 4918, section 11.2: 422 unprocessable entity http extensions for web distributed authoring and versioning (webdav) ...

425 Too Early - HTTP
the hypertext transfer protocol (http) 425 too early response status code indicates that the server is unwilling to risk processing a request that might be replayed, which creates the potential for a replay attack. status 425 too early specifications specification title rfc 8470, section 5.2: 425: early data using early data in http ...

426 Upgrade Required - HTTP
o do so after the client upgrades to a different protocol. ...

428 Precondition Required - HTTP
ttp 428 precondition required response status code indicates that the server requires the request to be conditional. typically, this means that a required precondition header, such as if-match, is missing. when a precondition header is not matching the server side state, the response should be 412 precondition failed. status 428 precondition required specifications specification title rfc 6585, section 3: 428 precondition required additional http status codes ...

429 Too Many Requests - HTTP
oo many requests response status code indicates the user has sent too many requests in a given amount of time ("rate limiting"). a retry-after header might be included to this response indicating how long to wait before making a new request. status 429 too many requests example http/1.1 429 too many requests content-type: text/html retry-after: 3600 specifications specification title rfc 6585, section 4: 429 too many requests additional http status codes ...

431 Request Header Fields Too Large - HTTP
which of the two is the problem in the response body — ideally, also include which headers are too large. ...

451 Unavailable For Legal Reasons - HTTP
tle></head> <body> <h1>unavailable for legal reasons</h1> <p>this request may not be serviced in the roman province of judea due to the lex julia majestatis, which disallows access to resources hosted on servers deemed to be operated by the people's front of judea.</p> </body> </html> specifications specification title rfc 7725: 451 unavailable for legal reasons an http status code to report legal obstacles ...

500 Internal Server Error - HTTP
e request. this error response is a generic "catch-all" response. ...

501 Not Implemented - HTTP
erver does recognize the method, but intentionally does not support it, the appropriate response is 405 method not allowed. ...

502 Bad Gateway - HTTP
ode indicates that the server, while acting as a gateway or proxy, received an invalid response from the upstream server. ...

503 Service Unavailable - HTTP
stimated time for the recovery of the service. ...

504 Gateway Timeout - HTTP
ay or proxy, did not get a response in time from the upstream server that it needed in order to complete the request. ...

505 HTTP Version Not Supported - HTTP
the hypertext transfer protocol (http) 505 http version not supported response status code indicates that the http version used in the request is not supported by the server. status 505 http version not supported specifications specification title rfc 7231, section 6.6.6: 505 http version not supported hypertext transfer protocol (http/1.1): semantics and content ...

506 Variant Also Negotiates - HTTP
s a client to retrieve the best variant of a given resource, where the server supports multiple variants. ...

507 Insufficient Storage - HTTP
fer protocol (http) 507 insufficient storage response status code may be given in the context of the web distributed authoring and versioning (webdav) protocol (see rfc 4918). it indicates that a method could not be performed because the server cannot store the representation needed to successfully complete the request. status 507 insufficient storage specifications specification title rfc 4918, section 11.5: 507 insufficient storage web distributed authoring and versioning ...

508 Loop Detected - HTTP
oop detected response status code may be given in the context of the web distributed authoring and versioning (webdav) protocol. ...

510 Not Extended - HTTP
tp extension framework, defined in rfc 2774. ...

511 Network Authentication Required - HTTP
control access to the network. ...

About the JavaScript reference - JavaScript
if you're learning javascript, or need help understanding some of its capabilities or features, check out the javascript guide. the javascript language is intended to be used within some larger environment, be it a browser, server-side scripts, or similar. ...

Intl - JavaScript
runtime's default locale is used. a unicode bcp 47 locale identifier consists of a language code, (optionally) a script code, (optionally) a region (or country) code, (optionally) one or more variant codes, and (optionally) one or more extension sequences, with all present components separated by hyphens. locale identifiers are case-insensitive ascii. however, it's conventional to use title case (first letter capitalized, successive letters lower case) for script code, upper case for region codes, and lower case for everything else. for example: "hi": hindi (language) "de-at": german (language) as used in austria (region) "zh-hans-cn": chinese (language) written in simplified characters (script) as used in china (region) "en-emodeng": english (language) in the "early modern en...

Object - JavaScript
b-class objects, prototype is a useful workaround to make a “base class” object of certain functions that act as objects. for example: var person = function(name) { this.name = name; this.cantalk = true; }; person.prototype.greet = function() { if (this.cantalk) { console.log('hi, i am ' + this.name); } }; var employee = function(name, title) { person.call(this, name); this.title = title; }; employee.prototype = object.create(person.prototype); employee.prototype.constructor = employee; //if you don't set object.prototype.constructor to employee, //it will take prototype.constructor of person (parent). //to avoid that, we set the prototype.constructor to employee (child). employee.prot...

Authoring MathML - MathML
the latex content of your web page marked by the "latex" class will be automatically parsed and converted to html+mathml: <head> ... <script type="text/javascript" src="latexmathml.js"></script> <link rel="stylesheet" type="text/css" href="latexmathml.standardarticle.css" /> ... </head> <body> ... <div class="latex"> \documentclass[12pt]{article} \begin{document} \title{latexml example} \maketitle \begin{abstract} this is a sample latexml document. \end{abstract} \section{first section} $$ \sum_{n=1}^{+\infty} \frac{1}{n^2} = \frac{\pi^2}{6} $$ \end{document} </div> ... jqmath is another script to parse a simple latex-like syntax but which also accepts non-ascii characters like √{∑↙{n=1}↖{+∞} 6/n^2} = π to write ∑ n = 1 + ∞ 6 n 2 = π . the installat...

Web media technologies
s, or as a destination for streamed video content. <video> can also be used as a way to link media apis with other html and dom technologies, including <canvas> (for frame grabbing and manipulation), for example. accessible from javascript as htmlvideoelement objects. <track> the html <track> element can be placed within an <audio> or <video> element to provide a reference to a webvtt format subtitle or caption track to be used when playing the media. accessible from javascript as htmltrackelement objects. <source> the html <source> element is used within an <audio> or <video> element to specify source media to present. multiple sources can be used to provide the media in different formats, sizes, or resolutions. accessible from javascript as htmlsourceelement objects. apis media capabi...

OpenSearch description format
discovery of search plugins web sites with search plugins can advertise them so firefox users can easily install the plugins. to support autodiscovery, add a <link> element for each plugin to the <head> of your web page: <link rel="search" type="application/opensearchdescription+xml" title="searchtitle" href="pluginurl"> replace the bolded items as explained below: searchtitle the name of the search to perform, such as "search mdc" or "yahoo! search". this must match your plugin file's <shortname>. pluginurl the url to the xml search plugin, so the browser can download it. if your site offers multiple search plugins, you can support autodiscovery for them all. for example: <link rel="search" type="application/opensearchdescription+xml" title="mysite: by auth...

Recommended Web Performance Timings: How long is too long? - Web Performance
indicating content will load (1 second), idling (50ms), animating (16.7s) and responding to user input (50 to 200ms). load goal the 'under a second' is often touted as optimal for load, but what does that mean? a second should be considered a rule in the maximum amount of time to indicate to a user that the request for new content was made and will load, such as the browser displaying the page title and the background color of the page displaying. the first asset retrieved from a request is usually an html document, which then makes calls for additional assets. as noted in the description of the critical rendering path, when received, browsers immediately start processing the html, rendering the content as it is received rather than waiting for additional assets to load. yes, one second fo...

Progressive web app structure - Progressive web apps (PWAs)
ton.addeventlistener('click', function(e) { notification.requestpermission().then(function(result) { if(result === 'granted') { randomnotification(); } }); }); the last block creates notifications that display a randomly-selected item from the games list: function randomnotification() { var randomitem = math.floor(math.random()*games.length); var notiftitle = games[randomitem].name; var notifbody = 'created by '+games[randomitem].author+'.'; var notifimg = 'data/img/'+games[randomitem].slug+'.jpg'; var options = { body: notifbody, icon: notifimg } var notif = new notification(notiftitle, options); settimeout(randomnotification, 30000); } the service worker the last file we will quickly look at is the service ...

How to make PWAs re-engageable using Notifications and Push - Progressive web apps (PWAs)
ush. ...

Structural overview of progressive web apps - Progressive web apps (PWAs)
byid("notifications"); button.addeventlistener('click', function(e) { notification.requestpermission().then(function(result) { if (result === 'granted') { randomnotification(); } }); }); the randomnotification() function follows, rounding out the last of the code in the file: function randomnotification() { var randomitem = math.floor(math.random()*games.length); var notiftitle = games[randomitem].name; var notifbody = 'created by '+games[randomitem].author+'.'; var notifimg = 'data/img/'+games[randomitem].slug+'.jpg'; var options = { body: notifbody, icon: notifimg } var notif = new notification(notiftitle, options); settimeout(randomnotification, 30000); } the service worker the last file we'll briefly look at here is the service worker, which ...

SVG Attribute reference - SVG: Scalable Vector Graphics
xlink attributes xlink:href, xli...

<a> - SVG: Scalable Vector Graphics
attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes most notably: xlink:title aria attributes aria-activedescendant, aria-atomic, aria-autocomplete, aria-busy, aria-checked, aria-colcount, aria-colindex, aria-colspan, aria-controls, aria-current, aria-describedby, aria-details, aria-disabled, aria-dropeffect, aria-errormessage, aria-expanded, aria-flowto, aria-grabbed, aria-haspopup, aria-hidden, aria-invalid, aria-keyshortcuts, aria-label, aria-labelledby, aria-level, ar...

<linearGradient> - SVG: Scalable Vector Graphics
candidate recommendation scalable vector gr...

<pattern> - SVG: Scalable Vector Graphics
attributes most notably: clip-path, clip-rule, color, color-interpolation, color-rendering, cursor, display, fill, fill-opacity, fill-rule, filter, mask, opacity, pointer-events, shape-rendering, stroke, stroke-dasharray, stroke-dashoffset, stroke-linecap, stroke-linejoin, stroke-miterlimit, stroke-opacity, stroke-width, transform, vector-effect, visibility xlink attributes most notably: xlink:title usage notes categoriescontainer elementpermitted contentany number of the following elements, in any order:animation elementsdescriptive elementsshape elementsstructural elementsgradient elements<a>, <altglyphdef>, <clippath>, <color-profile>, <cursor>, <filter>, <font>, <font-face>, <foreignobject>, <image>, <marker>, <mask>, <pattern>, <script>, <style>, <switch>, <text>, <view> specificatio...

<radialGradient> - SVG: Scalable Vector Graphics
candidate recommendation added fr attribute s...

<style> - SVG: Scalable Vector Graphics
stroke: maroon; stroke-width: 2px; } </style> <circle cx="5" cy="5" r="4" /> </svg> attributes type this attribute defines type of the style sheet language to use as a media type string. value type: <string>; default value: text/css; animatable: no media this attribute defines to which media the style applies. value type: <string>; default value: all; animatable: no title this attribute the title of the style sheet which can be used to switch between alternate style sheets. value type: <string>; default value: none; animatable: no global attributes core attributes most notably: id styling attributes class, style event attributes global event attributes, document element event attributes usage notes categoriesnonepermitted contentany elements or chara...

<textPath> - SVG: Scalable Vector Graphics
elledby, aria-level, aria-live, aria-modal, aria-multiline, aria-multiselectable, aria-orientation, aria-owns, aria-placeholder, aria-posinset, aria-pressed, aria-readonly, aria-relevant, aria-required, aria-roledescription, aria-rowcount, aria-rowindex, aria-rowspan, aria-selected, aria-setsize, aria-sort, aria-valuemax, aria-valuemin, aria-valuenow, aria-valuetext, role xlink attributes xlink:title usage notes categoriestext content element, text content child elementpermitted contentcharacter data and any number of the following elements, in any order:descriptive elements<a>, <altglyph>, <animate>, <animatecolor>, <set>, <tref>, <tspan> specifications specification status comment scalable vector graphics (svg) 2the definition of '<textpath>' in that specific...

<use> - SVG: Scalable Vector Graphics
candidate recommendation scala...

SVG documentation index - SVG: Scalable Vector Graphics
ference iri. the exact meaning of that link depends on the context of each element using it. 258 xlink:show deprecated, svg, svg attribute the xlink:show attribute indicates how a linked resource should be opened and is meant for xlink-aware processors. in case of a conflict, the target attribute has priority, since it can express a wider range of values. 259 xlink:title deprecated, svg, svg attribute the xlink:title attribute is used to describe the meaning of a link or resource in a human-readable fashion. 260 xlink:type deprecated, svg, svg attribute the xlink:type attribute identifies the type of xlink being used. in svg, only simple links are available. 261 xml:base deprecated, svg, svg attribute the xml:bas...

SVG 2 support in Mozilla - SVG: Scalable Vector Graphics
ed implementation status unknown linking change notes link svg resources with fragment identifiers implementation status unknown xlink:type, xlink:role, xlink:arcrole, xlink:show, and xlink:actuate attributes removed implementation status unknown xlink:href attribute deprecated in favor of href implemented (bug 1245751) xlink:title attribute deprecated in favor of child <title> implementation status unknown spaces in svg view fragments implementation status unknown pixel: and percent: spatial media fragments implementation status unknown linking to <view> elements does not cause implicit box transformation to show nearest ancestor <svg> element implementation status unknown uns...

For Further Reading - XSLT: Extensible Stylesheet Language Transformations
ibm's extensive xml developer site. this book is somewhat less comprehensive than michael kay's, but it covers the basics well, and offers some intriguing examples. http://www.amazon.com/xslt-doug-tidwell/dp/0596000537 learning xml, second edition author: erik t. ray length: 432 pages publisher: o'reilly media; 2 edition (september 22, 2003) isbn: 0596004206 as the title indicates, this is an overview of xml generally. chapter 6 is devoted specifically to xslt. http://www.amazon.com/gp/product/0596004206 digital websites world wide web consortium the w3c homepage: http://www.w3.org/ the main xsl page: http://www.w3.org/style/xsl/ the version 1.0 recommendation for xslt: http://www.w3.org/tr/xslt archive of public style (css and xslt) di...